Comprendre les graphiques : représentation des données et des graphiques sous-jacents

Les graphiques affichent les données visuellement en mappant les valeurs textuelles sur deux axes : horizontal (x) et vertical (y). L’axe x est appelé l’axe de catégorie et l’axe y est appelé l’axe de série. L’axe de catégorie peut afficher des valeurs numériques et non numériques alors que l’axe de série affiche uniquement des valeurs numériques.

Les graphiques des applications pilotées par un modèle peuvent être classés dans les catégories suivantes :

• Graphiques à série unique : graphiques qui affichent les données avec une valeur de série (y) mappée sur une valeur de catégorie (x).

• Graphiques à plusieurs séries : graphiques qui affichent les données avec plusieurs valeurs de série mappées sur une valeur de catégorie unique. Les graphiques à plusieurs séries incluent les histogrammes empilés, qui affichent verticalement la contribution de chaque série par rapport au total parmi des catégories, et les histogrammes empilés 100 %, qui comparent le pourcentage auquel contribue chaque série par rapport au total parmi des catégories. Vous pouvez combiner différents types de graphiques compatibles dans les graphiques à plusieurs séries, par exemple, un histogramme et un graphique en courbes, un graphique à barres et un graphique en courbes, etc.

Notes

Des graphiques à plusieurs catégories peuvent être créés via l’application web ou en modifiant les chaînes XML décrites ici.

Lors de la création d’un graphique dans les applications pilotées par un modèle à l’aide du Kit de développement logiciel (SDK), vous devez prendre en compte les deux aspects importants suivants :

• Données sous-jacentes du graphique : spécifiées à l’aide de la chaîne XML de description des données.

• Représentation des données (apparence)  : spécifiée à l’aide de la chaîne XML de description de la présentation.

Notes

Microsoft Chart Controls vous permet de créer différents types de graphiques tels que des histogrammes, des graphiques à barres, des graphiques en aires, des graphiques en courbes, des graphiques à secteurs, des graphiques en entonnoir, des graphiques en bulles et des graphiques en radar. Le concepteur de graphiques dans les applications pilotées par un modèle vous permet de créer uniquement certains types de graphiques. Toutefois, le Kit de développement logiciel (SDK) vous permet de créer la plupart des types de graphiques pris en charge par Microsoft Chart Controls.

Utiliser la chaîne XML de description des données pour spécifier les données graphiques

La chaîne XML de description des données définit les données qui s’affichent sur le graphique. Le contenu de la chaîne XML est validé par rapport au schéma de description des données de visualisation. Pour plus d’informations sur le schéma, voir Schéma de description des données de visualisation.

Vous pouvez spécifier la chaîne XML de description des données lorsque vous créez un graphique à l’aide de SavedQueryVisualization.DataDescription ou UserQueryVisualization.DataDescription pour le graphique appartenant à l’organisation ou à l’utilisateur, respectivement.

La chaîne XML de description des données contient les deux éléments suivants : <FetchCollection> et <CategoryCollection>.

L’élément <FetchCollection>

L’élément <FetchCollection> utilise FetchXML pour récupérer les données du graphique. La FetchXML requête spécifie des informations sur les colonnes du tableau, les fonctions d’agrégation et les clauses group by pour les données à afficher dans un graphique. Toutes les FetchXML fonctions d’agrégation sont prises en charge pour les graphiques. Pour plus d’informations sur les FetchXML fonctions d’agrégation, consultez Agréger des données à l’aide de FetchXml.

La FetchXML requête vous permet de filtrer vos données. En outre, les filtres sont appliqués aux graphiques via des vues. Par conséquent, si une condition de filtre est déjà spécifiée dans la FetchXML requête de l’élément <FetchCollection> et qu’en plus un filtre est appliqué via une vue, le graphique affichera les données renvoyées après celle-ci. applique tous les filtres. Pour plus d’informations sur l’utilisation de la FetchXML requête pour filtrer les données, consultez Interroger des données à l’aide de FetchXml.

Notes

Bien que la chaîne XML de description des données soit à nouveau validée par le schéma de description des données de visualisation, la FetchXML requête à l’intérieur de l’élément <FetchCollection> ne l’est pas. La FetchXML requête est validée par rapport au FetchXML schéma. Pour plus d’informations, voir Référence FetchXml.

Si le graphique est un graphique de comparaison, l’élément <FetchCollection> contient deux groupes par* clauses.

L’élément <CategoryCollection>

L’élément <CategoryCollection> contient des informations sur l’axe de catégorie (horizontal) et l’axe de série (vertical) d’un graphique.

• Chaque sous-élément <Category> est un élément enfant appelé <MeasureCollection> qui est mappé à l’élément <Series> dans la chaîne XML de description de la présentation. Un graphique à série unique contient un élément enfant <MeasureCollection> unique alors qu’un graphique à plusieurs séries contient plusieurs éléments enfants <MeasureCollection>, chacun étant mappé à l’élément <Series> correspondant dans la chaîne XML de description de la présentation.

• Chaque élément enfant <MeasureCollection> contient un élément appelé <Measure> qui correspond à la valeur de l’axe de série (vertical), correspondant à chaque valeur sur l’axe de catégorie (horizontal).

Exemple

Voici un exemple de chaîne XML de description des données :

<datadefinition>  
  <fetchcollection>  
    <fetch mapping="logical" count="10">  
      <entity name="opportunity">  
        <attribute name="estimatedvalue" />  
        <order attribute="estimatedvalue" descending="true" />  
      </entity>  
    </fetch>  
  </fetchcollection>  
  <categorycollection>  
    <category>  
      <measurecollection>  
        <measure alias="estimatedvalue" />  
      </measurecollection>  
    </category>  
  </categorycollection></datadefinition>  

Pour plus d’exemples de chaînes XML de description de données, voir Exemples de graphiques.

Utiliser la chaîne XML de description de la présentation pour spécifier la représentation des données

La chaîne XML de description de la présentation contient des informations sur l’apparence du graphique comme son titre, sa couleur et son type (graphique à barres, histogramme, graphique en courbes, etc.). Il n’existe aucune définition de schéma pour cette chaîne XML. Toutefois, la chaîne XML est une sérialisation de la classe Chart dans Microsoft Chart Controls. Pour plus d’informations, voir : Chart Controls

Vous pouvez spécifier la chaîne XML de description de la présentation lorsque vous créez un graphique à l’aide de SavedQueryVisualization.PresentationDescription ou UserQueryVisualization.PresentationDescription pour le graphique appartenant à l’organisation ou à l’utilisateur, respectivement.

Important

Dans Interface Unifiée, seul un sous-ensemble de propriétés est pris en charge. Plus d’information : Méthodes et propriétés prises en charge dans Interface Unifiée

Exemple pour le client web

Voici un exemple de chaîne XML de description de la présentation pour client web :

<Chart Palette="BrightPastel">  
  <Series>  
    <Series _Template_="All" Color="153, 204, 255" BorderColor="164, 164, 164" BorderDashStyle="Solid" BorderWidth="1" ShadowColor="128, 128, 128, 128" ShadowOffset="1" IsValueShownAsLabel="true" Font="{0}, 6.75pt" BackGradientStyle="TopBottom" BackSecondaryColor="0, 102, 153" LabelForeColor="100, 100, 100" ChartType="Column">  
      <SmartLabelStyle Enabled="True" />  
      <Points />  
    </Series>  
  </Series>  
  <ChartAreas>  
    <ChartArea _Template_="All" BackColor="White" BorderColor="26, 59, 105" BorderWidth="0" BorderDashStyle="Solid">      <AxisY LineColor="204, 204, 204" TitleFont="{0}, 8pt, GdiCharSet=0" TitleForeColor="100, 100, 100" LabelAutoFitMaxFontSize="7" LabelAutoFitMinFontSize="7">  
        <MajorTickMark LineColor="Gray" />  
        <MajorGrid Enabled="false" />  
        <LabelStyle Font="{0}, 6.75pt, GdiCharSet=0" ForeColor="100, 100, 100" />  
      </AxisY>  
      <AxisX LineColor="204, 204, 204" TitleFont="{0}, 8pt, GdiCharSet=0" TitleForeColor="100, 100, 100" LabelAutoFitMaxFontSize="7" LabelAutoFitMinFontSize="7">        <MajorTickMark LineColor="Gray" />        <MajorGrid Enabled="false" />  
        <LabelStyle Font="{0}, 6.75pt, GdiCharSet=0" ForeColor="100, 100, 100" />  
      </AxisX>  
    </ChartArea>  
  </ChartAreas>  
  <Titles>  
    <Title _Template_="All" Font="{0}, 9pt, style=Bold, GdiCharSet=0" ForeColor="100, 100, 100"></Title>  
  </Titles>  
  <BorderSkin PageColor="Control" BackColor="CornflowerBlue" BackSecondaryColor="CornflowerBlue" />  
</Chart>  

Pour plus d’exemples de chaînes XML de description de présentation, voir Exemples de graphiques.

Méthodes et propriétés prises en charge dans Interface Unifiée

La section suivante présente les méthodes et propriétés prises en charge dans Interface Unifiée :

AxisX

Obtient ou définit le type d’axe X de la série.

Propriétés

Nom de propriété	Description
Activée	Obtient ou définit une valeur qui indique si un axe est activé.
Étiquettestyle activé	Obtient ou définit un indicateur qui indique si l’étiquette est activée.
Couleur Étiquettestyle	Obtient ou définit la couleur de l’étiquette.
Format Étiquettestyle	Obtient ou définit la chaîne de mise en forme pour le texte de l’étiquette. Plus d’information : Format numérique pris en charge pour les graphiques
LineColor	Obtient ou définit la couleur de ligne d’un axe. Plus d’information : Format de couleur pris en charge
IsReversed	Obtient ou définit un indicateur qui indique si l’axe est inversé. S’il est défini sur vrai, il a deux effets pour l’axe des abscisses : - Les Étiquettes de l’axe des abscisses sont basculées dans l’ordre inverse (de droite à gauche) - Il déplace également l’axe des ordonnées du côté opposé, pour s’adapter au-dessus de l’étiquette de droite à gauche de l’axe des abscisses.
MajorGrid activé	Obtient ou définit un indicateur qui détermine si les lignes de grille majeures ou mineures sont activées.
MajorGrid LineColor	Obtient ou définit la couleur de ligne d’une grille. Plus d’information : Format de couleur pris en charge
MajorTickMark activé	Obtient ou définit un indicateur qui détermine si les lignes de grille majeures sont activées.
MajorTickMark LineColor	Obtient ou définit la couleur de ligne d’une grille.
Titre	Obtient ou définit le titre de l’axe.
TitleForeColor	Obtient ou définit la couleur de texte d’un titre d’axe. Plus d’information : Format de couleur pris en charge

Conseil

• Quand il y a trop de LABELS, HighCharts omet une Étiquette sur deux et essaie à nouveau d’effectuer le rendu. Pour contourner rapidement ce problème, il suffit de supprimer les enregistrements ou d’effectuer un zoom arrière dans le navigateur.

Exemple

 <AxisX Enabled="True" LineColor="165, 172, 181" Title="Test XAxis Title" TitleForeColor="91,151,213" IsReversed="true">
    <MajorTickMark LineColor="165, 172, 181" Enabled="true" />
    <MajorGrid LineColor="green" Enabled="true"/>
    <LabelStyle ForeColor="red" Format="#,0,.##K" Enabled="true" />
 </AxisX>

AxeY

Obtient ou définit le type d’axe des ordonnées de la série.

Propriétés

Nom de propriété	Description
AxeY2	Obtient ou définit un objet Axe qui représente l’axe des ordonnées secondaire. - Le deuxième axe Y ne s’applique qu’au graphique à plusieurs séries. - Si vous créez un graphique à séries multiples avec l’éditeur de graphiques, par défaut, la propriété YAxisType=Secondary sera ajoutée à la deuxième série de votre graphique, et un nœud AxisY2 est ajouté au XML. - Si vous souhaitez qu’une autre série soit mesurée par le deuxième axe des ordonnées, vous pouvez déplacer le YAxisType=Secondary vers ce nœud de série. - Si vous ne voulez pas d’un deuxième axe des ordonnées, vous pouvez supprimer le YAxisType=Secondary. - Si un axe des ordonnées (principal ou secondaire) mesure plus d’une série, le titre ne sera pas ajouté à cet axe, car le titre de l’axe des ordonnées ne sait pas quelle série afficher.
Activée	Obtient ou définit une valeur qui indique si un axe est activé.
Intervalle	Obtient ou définit l’intervalle d’un axe.
Étiquettestyle activé	Obtient ou définit un indicateur qui indique si l’étiquette est activée.
Couleur Étiquettestyle	Obtient ou définit la couleur de l’étiquette.
Format Étiquettestyle	Obtient ou définit la chaîne de mise en forme pour le texte de l’étiquette. Plus d’information : Format numérique pris en charge pour les graphiques
LineColor	Obtient ou définit la couleur de ligne d’un axe. Plus d’information : Format de couleur pris en charge
MajorGrid activé	Obtient ou définit un indicateur qui détermine si les lignes de grille majeures sont activées.
MajorGrid LineColor	Obtient ou définit la couleur de ligne d’une grille. Plus d’information : Format de couleur pris en charge
MajorTickMark activé	Obtient ou définit un indicateur qui détermine si les lignes de grille majeures sont activées.
MajorTickMark LineColor	Obtient ou définit la couleur de ligne d’une grille.
Maximum	Obtient ou définit la valeur maximum d’un axe.
Minimum	Obtient ou définit la valeur minimum d’un axe.
Titre	Obtient ou définit le titre de l’axe.
TitleForeColor	Obtient ou définit la couleur de texte d’un titre d’axe. Plus d’information : Format de couleur pris en charge

Exemple

<AxisY Enabled="True" LineColor="165, 172, 181" Title="Test YAxis Title" TitleForeColor="91,151,213" Interval="1" Minimum="0" Maximum="5">
  <MajorTickMark LineColor="165, 172, 181" Enabled="true" />
  <MajorGrid LineColor="green" Enabled="true"/>
  <LabelStyle ForeColor="red" Enabled="true" />
</AxisY>
<AxisY2 Enabled="True" LineColor="165, 172, 181" Title="Test YAxis2 Title" TitleForeColor="91,151,213" Interval="10" Minimum="0" Maximum="100">
  <MajorTickMark LineColor="165, 172, 181" Enabled="true" />
  <MajorGrid LineColor="green" Enabled="true"/>
  <LabelStyle ForeColor="red" Enabled="true" />
</AxisY2>

Graphique

La classe racine des graphiques.

Propriétés

Nom de propriété

Description

PaletteCustomColor

Obtient ou définit un tableau de couleurs de palette personnalisées. Il suit la priorité comme indiqué ci-dessous : - Restitue la couleur définie dans le nœud Series. - Si la palette de couleurs est spécifiée, le graphique choisit la couleur depuis la palette de couleurs. - Si aucune n’est spécifiée, il récupère la palette de couleurs par défaut. Plus d’information : Format de couleur pris en charge

Exemple

<Chart Palette="None" PaletteCustomColors="91, 151, 213; #4169E1, red, 127,97,142,206">

ChartArea

Représente une zone de graphique sur l’image du graphique.

Propriétés

Nom de propriété	Description
Area3DStyle Enable3D	Obtient ou définit une valeur qui indique si l’indicateur active et désactive la 3D pour une zone de graphique. Il prend en charge les types de graphiques 3D suivants : - 3D Colonne - 3D Bar - 3D StackedColumn - 3D StackedBar - 3D StackedColumn100 - 3D StackedBar100 - 3D Pie
BackColor	Autorisez les utilisateurs à définir l’arrière-plan du tracé sur une couleur unie ou un dégradé. Plus d’information : Format de couleur pris en charge
BackSecondaryColor	Autorisez les utilisateurs à définir l’arrière-plan du tracé sur une couleur unie ou un dégradé. Plus d’information : Format de couleur pris en charge
BackGradientStyle	Autorisez les utilisateurs à définir l’arrière-plan du tracé sur une couleur unie ou un dégradé.

Exemple

<ChartArea BackColor="orange" BackSecondaryColor="purple" BackGradientStyle="LeftRight" >
  <Area3DStyle Enable3D="true" />
</ChartArea>

Légende

Représente la légende de l’image du graphique.

Propriétés

Nom de propriété	Description
Activée	Indique si la légende est activée. Par défaut, la valeur est définie sur True.

Exemple

<Legends>
  <Legend Enabled="True"/>
</Legends>

Série

Stocke les points de données et les séries.

Propriétés

Nom de propriété	Description
BorderColor	Obtient ou définit la couleur de bordure du point de données. Plus d’information : Format de couleur pris en charge
BorderWidth	Obtient ou définit la largeur de bordure du point de données.
ChartType	Valeur d’énumération qui indique le type de graphique utilisé pour représenter la série. La valeur par défaut est Colonne. Il prend en charge les types de graphiques suivants : - Colonne - StackedColumn - StackedColumn100 - Barre - StackedBar - StackedBar100 - Zone - StackedArea - StackedArea100 - Ligne - Secteurs - Synthèse - Balise - Anneaux - Point
Color	Obtient ou définit la couleur du point de données. Pour les graphiques en entonnoir et à secteurs, la propriété de couleur définie dans le nœud de série est ignorée, mais elle sélectionne la couleur du graphique dans la palette de couleurs. Plus d’information : Format de couleur pris en charge
IsValueShownAsLabel	Obtient ou définit un indicateur qui indique s’il faut afficher la valeur de point de données sur l’étiquette.
CustomProperties	Permet aux utilisateurs de définir FunnelNeckHeight et FunnelNeckWidth pour personnaliser la forme du graphique en entonnoir. FunnelNeckHeight et FunnelNeckWidth représentent le pourcentage. Ce paramètre n’est pris en charge que pour les types de graphiques en entonnoir.
IsVisibleInLegend	Obtient ou définit un indicateur qui indique si l’élément est affiché dans la légende.
LabelForeColor	Obtient ou définit la couleur du texte de l’étiquette. Plus d’information : Format de couleur pris en charge
LabelFormat	Obtient ou définit le format de l’étiquette du point de données. Plus d’information : Format numérique pris en charge pour les graphiques
LegendText	Obtient ou définit le texte de l’élément dans la légende. Pour les graphiques en entonnoir et à secteurs, la légende affiche la valeur de chaque point de données dans une série. Au lieu d’afficher le nom de la série dans son ensemble.
YAxisType	Obtient ou définit le type d’axe des ordonnées d’une série. Seul le deuxième axe des ordonnées est pris en charge, pas le deuxième axe des abscisses.

Notes

• Actuellement, nous prenons partiellement en charge #PERCENT. #VAL et #TOTAL sont pris en charge dans Unified Interface.
• Pour les graphiques hors comparaison, nous prenons en charge un maximum de 5 séries (1 catégorie). Pour les graphiques de comparaison, nous ne prenons en charge que 1 série et 2 catégories.

Exemple

<Series>
  <Series ChartType="Column" Color="91, 151, 213" LegendText="Est Revenue" IsVisibleInLegend="True" BorderColor="red" BorderWidth="1" IsValueShownAsLabel="True" LabelFormat="$#,0,.##K" LabelForeColor="59, 59, 59">
  </Series>
  <Series ChartType="Column" Color="237, 125, 49" LegendText="Actual Revenue" IsVisibleInLegend="True" BorderColor="red" BorderWidth="1" IsValueShownAsLabel="True" LabelFormat="$#,0,.##K" LabelForeColor="59, 59, 59" YAxisType="Secondary">
  </Series>
</Series>

Format de couleur pris en charge dans Interface Unifiée

Interface Unifiée prend en charge les formats de couleur suivants dans la présentation graphique xml, qui est compatible avec le client web :

• Format décimal RGB : 97,142,206
• Format hexadécimal RGB : #4169E1
• Format décimal ARGB : 127,90,138,57
• Couleurs nommées de navigateur reconnues : rouge, transparent

Format numérique pris en charge pour les graphiques dans Interface Unifiée

Valeurs de mise en forme	Description
#,0	Pas de mise à l’échelle, pas de décimales, zéro non significatif
#,0,.##K	Des milliers, jusqu’à 2 décimales, zéro non significatif
#,0,,.##M	Des millions, jusqu’à 2 décimales, zéro non significatif
#,0,,,.##B	Des milliards, jusqu’à 2 décimales, zéro non significatif
C	Devise avec décimales par défaut
C0	Devise sans décimale
C2	Devise avec 2 décimales
F0	Point fixe
#,0;(#,0);' '	Pas de mise à l’échelle, pas de décimales, zéro non significatif, valeur négative affichée entre accolades, supprime les zéros
#,0,.##K;(#,0,.##K);' '	Des milliers, jusqu’à 2 décimales, zéro non significatif, valeur négative affichée entre accolades, supprime les zéros
#,0,,.##M;(#,0,,.##M);' '	Des millions, jusqu’à 2 décimales, zéro non significatif, valeur négative affichée entre accolades, supprime les zéros
#,0,,,.##B;(#,0,,,.##B);' '	Des milliards, jusqu’à 2 décimales, zéro non significatif, valeur négative affichée entre accolades, supprime les zéros
%	Le signe de pourcentage (%) dans une chaîne de format entraîne la multiplication d’un nombre par 100 avant qu’il ne soit formaté

Voir aussi

Visualisations (Graphiques)
Actions sur les visualisations (graphiques)
Créer un graphique
Interroger des données à l’aide de FetchXml
Schéma de description des données de visualisation
Exemples de graphiques
Classe Chart (Microsoft Chart Controls)

Notes

Pouvez-vous nous indiquer vos préférences de langue pour la documentation ? Répondez à un court questionnaire. (veuillez noter que ce questionnaire est en anglais)

Le questionnaire vous prendra environ sept minutes. Aucune donnée personnelle n’est collectée (déclaration de confidentialité).