Didacticiel : création d'un graphique de base

  • Article

Ce didacticiel montre comment ajouter le contrôle Chart à votre application Windows Forms ou Web, puis ajouter à votre graphique des données, un titre, des légendes et des annotations.

Ajout d'un contrôle Chart

Suivez les étapes ci-dessous pour ajouter un contrôle Chart à votre application Windows Forms ou Web.

Pour ajouter un contrôle Chart à votre application

  1. En mode Design, ouvrez la Boîte à outils.

  2. Faites glisser un contrôle Chart de la catégorie Données vers la zone de conception.

    Si vous ne voyez pas le contrôle Chart dans la Boîte à outils, cliquez avec le bouton droit dans la Boîte à outils, sélectionnez Choisir les éléments, puis sélectionnez les espaces de noms suivants sous l'onglet Composants .NET Framework :

    Notes

    Pour trouver plus facilement le contrôle Chart dans la Boîte à outils, masquez les contrôles inactifs.Pour cela, cliquez avec le bouton droit sur la Boîte à outils et désactivez l'élément Afficher tout.

  3. Cliquez avec le bouton droit sur le contrôle Chart dans la zone de conception, puis sélectionnez Propriétés.

  4. Dans la fenêtre Propriétés, cliquez sur le bouton Par catégorie.

  5. Dans la catégorie Graphique de la fenêtre Propriétés, cliquez sur la propriété de collection ChartAreas, puis sur le bouton de sélection (…).L'Éditeur de collections ChartAreas s'ouvre.

    La collection ChartAreas (un objet ChartAreaCollection) contient toutes les zones de graphique du contrôle Chart.Notez que la collection contient déjà une zone de graphique nommée "ChartArea1".

  6. Cliquez sur Ajouter, puis sur OK.Un nouvel objet ChartArea est ajouté à la collection avec le nom par défaut "ChartArea2".

    Notez que le graphique de la zone de conception est réduit à la moitié de sa taille d'origine.La raison en est que la zone de graphique récemment créée est placée en bas, mais ne contient pas encore de série de données.

  7. Dans la fenêtre Propriétés, cliquez sur la collection Series, puis sur le bouton de sélection.L'Éditeur de collections Series s'ouvre.

    La collection Series (un objet SeriesCollection) contient toutes les séries de données du contrôle Chart.Notez que la collection contient déjà une série nommée "Series1".

  8. Dans l'Éditeur de collections Series, cliquez sur Ajouter, puis définissez les propriétés suivantes avec l'objet Series que vous venez de créer :

    Propriété

    Valeur

    ChartArea

    ChartArea2

    ChartType

    Bar

    Name

    BarChart

  9. Cliquez sur OK, puis à nouveau sur OK.

    Il existe désormais plusieurs zones de graphique, chacune contenant une série de données.Toutefois, vous ne pouvez rien voir tant que vous n'avez pas exécuté votre application, car les séries n'ont toujours pas de données.

Ajout de données au graphique

Suivez les étapes ci-dessous pour ajouter des données au contrôle Chart que vous venez de créer.

Pour ajouter des données au graphique

  1. Ouvrez à nouveau l'Éditeur de collections Series.

  2. Dans la zone Membres, sélectionnez Series1.

  3. Dans la catégorie Données de la zone de propriétés Series1, cliquez sur la propriété de collection Points, puis sur le bouton de sélection.L'Éditeur de collections DataPoint s'ouvre.

    La collection Points (un objet DataPointCollection) contient tous les points de données de la série actuelle.

  4. Dans l'Éditeur de collections DataPoint, cliquez sur Ajouter, puis affectez une valeur à la propriété YValues de l'objet DataPoint récemment créé.

    Répétez cette étape jusqu'à ce que vous ayez cinq points de données dans la collection.

  5. Cliquez sur OK, puis répétez les étapes précédentes pour ajouter des points de données à la série BarChart.

  6. Dans l'Éditeur de collections Series, cliquez sur OK.

  7. Exécutez l'application.

    Vous pouvez à présent voir dans le contrôle Chart deux zones de graphique qui affichent les points de données que vous venez de créer dans les deux séries.Notez les types de graphiques différents des deux séries.

Ajout de légendes au graphique

Suivez les étapes ci-dessous afin d'ajouter une légende pour chaque série que vous venez de créer.

Pour ajouter une légende pour chaque série

  1. Dans la catégorie Graphique de la fenêtre Propriétés, cliquez sur la propriété de collection Legends, puis cliquez sur le bouton de sélection (...) situé à droite.L'Éditeur de collections Legend s'ouvre.

    La collection Legends (un objet LegendCollection) contient toutes les légendes du contrôle Chart.

  2. Si l'Éditeur de collections Legend ne contient pas encore de légende, cliquez sur Ajouter.

  3. Définissez les propriétés suivantes avec l'objet Legend :

    Propriété

    Valeur

    DockedToChartArea

    ChartArea1

    Docking

    Right

    IsDockedInsideChartArea

    False

  4. Cliquez à nouveau sur Ajouter, puis définissez les propriétés suivantes avec l'objet Legend récemment créé :

    Propriété

    Valeur

    DockedToChartArea

    ChartArea2

    Docking

    Right

  5. Cliquez sur OK.

    Notez que dans la zone de conception, la deuxième légende est montrée vide.Par défaut, les deux séries sont affectées à la première légende.Vous pouvez affecter chaque série à une légende différente.

  6. Ouvrez à nouveau l'Éditeur de collections Series.

  7. Dans la zone Membres, sélectionnez BarChart.

  8. Dans la catégorie Légende de la zone de propriétés BarChart, dans la liste déroulante de la propriété Legend, sélectionnez Legend2.

  9. Cliquez sur OK.

  10. Exécutez l'application.

Ajout d'un titre au graphique

Suivez les étapes ci-dessous pour ajouter un titre au graphique.

Pour ajouter un titre au graphique

  1. Dans la catégorie Graphique de la fenêtre Propriétés, cliquez sur la propriété de collection Titles, puis sur le bouton de sélection.L'Éditeur de collections Title s'ouvre.

    La collection Titles (un objet TitleCollection) contient tous les titres du contrôle Chart.

  2. Dans l'Éditeur de collections Legend, cliquez sur Ajouter.

  3. Dans la catégorie Apparence de la zone de propriétés Title1, tapez un titre de graphique dans la propriété Text.

  4. Cliquez sur OK.

  5. Exécutez l'application.

Marquage d'un point de données avec une annotation

Suivez les étapes ci-dessous pour utiliser une annotation afin de marquer un point de données du graphique.

Pour marquer un point de données avec une annotation

  1. Dans la catégorie Graphique de la fenêtre Propriétés, cliquez sur la propriété de collection Annotations, puis sur le bouton de sélection.L'Éditeur de collections Annotation s'ouvre.

    La collection Annotations (un objet AnnotationCollection) contient toutes les annotations du contrôle Chart.

  2. Dans l'Éditeur de collections Annotation, cliquez sur la flèche Ajouter et sélectionnez ArrowAnnotation.

  3. Dans la catégorie Ancre de la zone de propriétés ArrowAnnotation1, cliquez sur la flèche AnchorDataPoint et sélectionnez le premier point de données de Series1.

  4. Définissez les propriétés suivantes avec l'objet Legend récemment créé :

    Propriété

    Valeur

    Height

    -5

    Width

    0

    AnchorOffSetY

    -2.5

  5. Dans la catégorie Divers, développez la propriété SmartLabelStyle et affectez à sa propriété IsOverlappedHidden la valeur False.

  6. Cliquez sur OK.

  7. Exécutez l'application.

Étape suivante

Vous savez maintenant ajouter le contrôle Chart à votre application Windows Forms ou Web, puis ajouter à votre graphique des données, un titre, des légendes et des annotations.Pour apprendre à utiliser des graphiques 3D, consultez Didacticiel : transformation en graphique 3D.

Voir aussi

Référence

System.Windows.Forms.DataVisualization.Charting

System.Web.UI.DataVisualization.Charting

Autres ressources

Mise en route

Utilisation de contrôles Chart