Exemple : Camemberts
Dans cette section, nous discutons les camemberts 2D et 3D contenus dans le fichier SPS YearlySales.sps. Le design SPS est basé sur le schéma XML YearlySales.xsd et il utilise YearlySales.xml (capture d’écran ci-dessous) comme son fichier de travail XML. Tous les trois fichiers sont situés dans le dossier (Mes) Documents, C:\Documents and Settings\<username>\My Documents\Altova\StyleVision2025\StyleVisionExamples/Tutorial/Charts.
<?xml version="1.0" encoding="UTF-8"?> <Data xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="YearlySales.xsd"> <ChartType>Pie Chart 2D</ChartType> <Region id="Americas"> <Year id="2005">30000</Year> <Year id="2006">90000</Year> <Year id="2007">120000</Year> <Year id="2008">180000</Year> <Year id="2009">140000</Year> <Year id="2010">100000</Year> </Region> <Region id="Europe"> <Year id="2005">50000</Year> <Year id="2006">60000</Year> <Year id="2007">80000</Year> <Year id="2008">100000</Year> <Year id="2009">95000</Year> <Year id="2010">80000</Year> </Region> <Region id="Asia"> <Year id="2005">10000</Year> <Year id="2006">25000</Year> <Year id="2007">70000</Year> <Year id="2008">110000</Year> <Year id="2009">125000</Year> <Year id="2010">150000</Year> </Region> </Data> |
Après avoir ouvert le fichier SPS dans StyleVision, basculez à l’Aperçu Authentic, et, dans la zone de liste déroulante Type de graphique (capture d’écran ci-dessous), sélectionnez Camembert 2D et Camembert 3D pour voir les deux types de graphiques.
Pour chaque type de graphique (camemberts 2D et camemberts 3D), il existe quatre graphiques. Les trois premiers graphiques de chaque type de graphique affichent les ventes annuelles des trois régions de vente. Chacun de ces camemberts (voir la capture d’écran d’un camembert 3D ci-dessous) représente une seule région, et les secteurs du camembert représentent les ventes de la région par année pour les six années entre 2005 et 2010.
Pour consulter les paramètres du graphique de ces graphiques, passez au Mode Design, sélectionnez la branche appropriée (Camembert 2D ou Camembert 3D) dans la première condition du design, cliquez avec la touche de droite dans le graphique et sélectionnez Éditer Paramètres du graphique. Le dialogue Configuration de graphique s’ouvre.
Notez les points suivants sur les graphiques des ventes annuelles régionales :
1.Les graphiques ont été insérées à l’intérieur de l’élément Region pour que le nœud contextuel est l’élément Region. Un graphique est créé pour cette raison pour chaque itération du moteur XSLT au-dessus de l’élément Region.
2.Le titre de chaque graphique contient la valeur de l’attribut Region/@id. Cliquez sur le bouton Paramètres dynamiques XPath pour voir comment cela est fait.
3.Puisque seule une série est requise, nous pouvons laisser l’Axe Z ou l’Axe du Nom de Séries vide. Ceci résulte en une série no-name par défaut étant créée.
4.L’Axe X sélectionne les libellés à être utilisés pour les secteurs du camembert, dans ce cas les années 2005 à 2010, qui sont obtenues avec l’expression XPath Year/@id (voir la capture d’écran ci-dessous).
5.L’Axe Y sélectionne les valeurs qui apparaissent pour chaque secteur du camembert. Dans notre exemple, ce sont les contenus de l’élément enfants Year de l’élément Region.
6.Le nombre de secteurs du camembert est déterminé selon les Règles du sélecteur des données de graphique. Donc, si la sélection était faite dans la capture d’écran ci-dessous, un autre secteur pour l’année 2011 serait ajouté avec une valeur de 60000.
7.Les items de la séquence sélectionnée pour l’Axe X seront assignés, par ordre correspondant, comme libellé pour chaque secteur du camembert. Chaque item de l’Axe X génère également un item de légende.
8.Le nombre de l’Axe X et de l’Axe Y dans chaque série devrait être le même (voir la capture d’écran ci-dessus), bien qu’il ne soit pas une erreur s’il n’est pas le même. S’il y a moins d’éléments de l’Axe X que de l’Axe Y, alors les secteurs du camembert (qui n’ont pas d’item de l’Axe X correspondant) seront sans libellé. S’il existe plus d’items de l'Axe X que d’items de l'Axe Y, alors les items supplémentaires de l’Axe X seront ignorés pour la génération de libellé, mais générés comme items de légende.
Utiliser des variables dans les expressions Xpath qui sélectionnent des données d’axes
L’exemple du camembert 2D a quatre camambert en bas de la page : le camembert « Yearly Market Share » (capture d’écran ci-dessous).
Dans l’Aperçu Authentic, quand la sélection de l’année est modifiée dans la zone de liste déroulante Select Year, le camembert change pour afficher les valeurs correctes pour l’année sélectionnée. Ceci est obtenu en (i) stockant la sélection de l’utilisateur dans une variable éditable pour Authentic ($SelectYear), et (ii) utilisant la variable éditable dans un attribut XPath pour déterminer quelles années sont sélectionnées pour l’Axe Y : for $i in //Year[@id=$SelectYear] return $i. Dans le Mode Design, ouvrez le dialogue de configuration du Graphique pour voir les paramètres de sélection des données. Aussi, les libellés de l’Axe X contiennent la part du pourcentage du camembert de cet Axe X ; le pourcentage peut être activé ou désactivé dans les paramètres du camembert des paramètres avancés du graphique. Dans ces paramètres, vous pouvez aussi spécifier si la valeur de l’Axe Y devrait être affichée dans les libellés ou non.
Utiliser les capacités d'XPath pour une sélection de données complexe
La chose importante dont il faut se rappeler est que la sélection des données pour chaque axe (X et Y) doit renvoyer la séquence des items atomiques requis. Le dernier camembert 3D affiche les ventes mondiales annuelles. Les expressions XPath pour la sélection des données sont comme suit :
Axe X: for $i in distinct-values(//Year/@id) return $i
Cette sélection aurait pu être facileement : 2005, 2006, 2007, 2008, 2009, 2010
Axe Y: for $i in distinct-values(//Year/@id) return sum(//Year[@id=$i])
La sélection renvoie, pour chaque année, la somme des ventes mondiales pour cette année, à savoir, pour une année donnée, la somme des ventes dans les trois régions.