Composant Graphe SVG : Différence entre versions
De BlueWiki
(→Généralités) |
(→Evolution) |
||
| (72 révisions intermédiaires par 2 utilisateurs sont masquées) | |||
| Ligne 1 : | Ligne 1 : | ||
==Généralités== | ==Généralités== | ||
| + | -> [[Composant_Graphe_SVG-EN|English version]] [[File:icone_drapeau-anglais.jpg]] | ||
| + | |||
Le composant permet de générer les graphes suivants | Le composant permet de générer les graphes suivants | ||
| − | * Barres | + | * Barres, barres empilées, barres proportionnelles |
* Aires | * Aires | ||
* Courbes | * Courbes | ||
| − | * Combinés (aires + barres + courbes) | + | * Combinés (aires + barres + courbes + points) |
* Camembert | * Camembert | ||
* Pyramides | * Pyramides | ||
* Kiviat ou graphes en étoiles | * Kiviat ou graphes en étoiles | ||
* Graphe à bulles | * Graphe à bulles | ||
| + | * Graphe polaires | ||
| + | * Cartes colorisées | ||
| + | * Time Line | ||
| − | La génération des graphes se fait par des | + | La génération des graphes se fait par des commandes très simples et le composant est fournit avec une base d'exemples. |
| Ligne 18 : | Ligne 23 : | ||
Au survol vous pouvez connaitre l'élément survolé pour pouvoir afficher une bulle d'aide personnalisée et détaillée. | Au survol vous pouvez connaitre l'élément survolé pour pouvoir afficher une bulle d'aide personnalisée et détaillée. | ||
| − | Comme ce composant | + | ==Evolution== |
| + | Comme ce composant évolue rapidement, nous sommes à l'écoute de vos suggestions pour le faire progresser. | ||
| − | + | Version courante 1.6 du 23 mai 2018 | |
| − | + | ||
| + | <big>Consultez les [[Release Notes]]</big> | ||
==Commandes== | ==Commandes== | ||
*[[SGR_Generate_bubbleChart]] permet de générer des graphes à bulles | *[[SGR_Generate_bubbleChart]] permet de générer des graphes à bulles | ||
| − | *[[SGR_Generate_Graph]] permet de générer des graphes en courbes, aires | + | *[[SGR_Generate_Gauge]] permet de générer des jauges (version bêta) |
| − | *[[SGR_Generate_Pie]] permet de générer des camemberts | + | *[[SGR_Generate_Graph]] permet de générer des graphes en courbes, courbes de bézier, aires, barres, points ou graphes combinés |
| + | *[[SGR_Generate_Pie]] permet de générer des camemberts et des donuts | ||
| + | *[[SGR_Generate_ProportionalPie]] permet de générer des camemberts dont les parties occupent le même angle mais pas le même rayon | ||
| + | *[[SGR_Generate_PolarGraph]] permet de générer des graphes polaires | ||
*[[SGR_Generate_Kiviat]] permet de générer des graphes de Kiviat ou graphes en étoile | *[[SGR_Generate_Kiviat]] permet de générer des graphes de Kiviat ou graphes en étoile | ||
*[[SGR_Generate_Pyramid]] permet de générer des pyramides telles des pyramides des ages | *[[SGR_Generate_Pyramid]] permet de générer des pyramides telles des pyramides des ages | ||
| + | *[[SGR_GenerateTimeLine]] permet de générer des gantt (timeline) | ||
| + | |||
| + | |||
| + | *[[SGR_DrawMap]] permet de mettre des cartes ou d'autres dessin en couleurs | ||
| + | |||
| + | *[[SGR_Generate_TableFromArray]] permet de mettre en page des tableaux | ||
| + | |||
| + | ==Utilitaires== | ||
| + | *[[SGR_getColoredRectangle]] | ||
| + | *[[SGR_GetSVGColors]] | ||
| + | *[[SGR_GetTexteSize]] | ||
| + | |||
| + | ==Annexes== | ||
| + | *[[Liste des symboles]] | ||
| + | *[[Couleurs_en_SVG]] | ||
| + | |||
==Exemples== | ==Exemples== | ||
| Ligne 34 : | Ligne 60 : | ||
<gallery> | <gallery> | ||
Fichier:Barre1.jpg|Exemple de barres | Fichier:Barre1.jpg|Exemple de barres | ||
| + | Fichier:BarresValeurs_ex1.jpg|Exemple de barres avec affichage des valeurs | ||
| + | Fichier:stackBar_ex1.jpg|Exemple de barres empilées | ||
| + | Fichier:ProportionnalBar_ex1.jpg|Exemple de barres proportionnelles | ||
| + | Fichier:BarreHorizontales.jpg|Exemple de barres horizontales | ||
Fichier:Courbe1.jpg|Exemple de courbes | Fichier:Courbe1.jpg|Exemple de courbes | ||
| + | Fichier:CourbesPivotées.jpg|Exemple de courbes pivotées | ||
Fichier:Aires1.jpg|Exemple d'aires | Fichier:Aires1.jpg|Exemple d'aires | ||
| + | Fichier:Aires_ex2.jpg|Exemple d'aires | ||
| + | Fichier:aires_empliees_ex1.jpg|Exemple d'aires empilées | ||
| + | Fichier:aireProp_ex1.jpg|Exemple d'aires proportionnelles | ||
| + | Fichier:AireEnveloppe_ex1.jpg|Exemple d'aires enveloppes + courbes | ||
Fichier:Combinaison1.jpg|Exemple de graphe combinant aires, barres et courbes | Fichier:Combinaison1.jpg|Exemple de graphe combinant aires, barres et courbes | ||
Fichier:Kiviat1.jpg|Exemple de graphe de Kiviat (Etoile, Radar) | Fichier:Kiviat1.jpg|Exemple de graphe de Kiviat (Etoile, Radar) | ||
Fichier:Pie1.jpg|Exemple de camembert | Fichier:Pie1.jpg|Exemple de camembert | ||
| + | Fichier:PieWithName.jpg|Exemple de camembert avec nom et une partie excentrée | ||
| + | Fichier:DonutsWithPercent.jpg|Exemple d'anneau avec les pourcentages | ||
Fichier:Pyramid2.jpg|Exemple de Pyramide | Fichier:Pyramid2.jpg|Exemple de Pyramide | ||
Fichier:Pyramid1.jpg|Exemple de Pyramide | Fichier:Pyramid1.jpg|Exemple de Pyramide | ||
Fichier:PyramideExempleCode.jpg|Exemple de Pyramide | Fichier:PyramideExempleCode.jpg|Exemple de Pyramide | ||
| + | Fichier:Courbe avec dégradé.jpg|Exemple de courbe avec un dégradé | ||
Fichier:GrapheBulle1.jpg|Exemple de graphe a bulle | Fichier:GrapheBulle1.jpg|Exemple de graphe a bulle | ||
| + | Fichier:Array.jpg|Exemple de tableau mis en page | ||
| + | Fichier:Jauge2.jpg|Exemple de jauge basic2 | ||
| + | Fichier:Gauge1.jpg|Exemple de jauge basic | ||
| + | Fichier:US.jpg|Carte des états unis colorisée | ||
| + | Fichier:EU.jpg|Carte de l'Europe colorisée | ||
| + | Fichier:BarGradient.jpg|Exemple de barres avec gradient de couleur | ||
| + | Fichier:Donut4.jpg|Anneau avec fond de couleur dégradé, couleur sous la légende, polices modifiées | ||
| + | Fichier:SPLine.jpg|Exemple de courbe de Bézier (SPLine) avec gradient de couleur et droite de régression | ||
| + | Fichier:SpecificLook.jpg|Exemple de barres avec des apparences spécifiques pour certaines | ||
</gallery> | </gallery> | ||
Version actuelle en date du 23 mai 2018 à 22:44
Sommaire |
[modifier] Généralités
Le composant permet de générer les graphes suivants
- Barres, barres empilées, barres proportionnelles
- Aires
- Courbes
- Combinés (aires + barres + courbes + points)
- Camembert
- Pyramides
- Kiviat ou graphes en étoiles
- Graphe à bulles
- Graphe polaires
- Cartes colorisées
- Time Line
La génération des graphes se fait par des commandes très simples et le composant est fournit avec une base d'exemples.
Vous pourrez prochainement accéder à un nouveau type de graphes : Graphe de répartition en aire.
Au survol vous pouvez connaitre l'élément survolé pour pouvoir afficher une bulle d'aide personnalisée et détaillée.
[modifier] Evolution
Comme ce composant évolue rapidement, nous sommes à l'écoute de vos suggestions pour le faire progresser.
Version courante 1.6 du 23 mai 2018
Consultez les Release Notes
[modifier] Commandes
- SGR_Generate_bubbleChart permet de générer des graphes à bulles
- SGR_Generate_Gauge permet de générer des jauges (version bêta)
- SGR_Generate_Graph permet de générer des graphes en courbes, courbes de bézier, aires, barres, points ou graphes combinés
- SGR_Generate_Pie permet de générer des camemberts et des donuts
- SGR_Generate_ProportionalPie permet de générer des camemberts dont les parties occupent le même angle mais pas le même rayon
- SGR_Generate_PolarGraph permet de générer des graphes polaires
- SGR_Generate_Kiviat permet de générer des graphes de Kiviat ou graphes en étoile
- SGR_Generate_Pyramid permet de générer des pyramides telles des pyramides des ages
- SGR_GenerateTimeLine permet de générer des gantt (timeline)
- SGR_DrawMap permet de mettre des cartes ou d'autres dessin en couleurs
- SGR_Generate_TableFromArray permet de mettre en page des tableaux
[modifier] Utilitaires
[modifier] Annexes
[modifier] Exemples
Exemple de barres
Exemple de barres avec affichage des valeurs
Exemple de barres empilées
Exemple de barres proportionnelles
Exemple de barres horizontales
Exemple de courbes
Exemple de courbes pivotées
Exemple d'aires
Exemple d'aires
Exemple d'aires empilées
Exemple d'aires proportionnelles
Exemple d'aires enveloppes + courbes
Exemple de graphe combinant aires, barres et courbes
Exemple de graphe de Kiviat (Etoile, Radar)
Exemple de camembert
Exemple de camembert avec nom et une partie excentrée
Exemple d'anneau avec les pourcentages
Exemple de Pyramide
Exemple de Pyramide
Exemple de Pyramide
Exemple de courbe avec un dégradé
Exemple de graphe a bulle
Exemple de tableau mis en page
Exemple de jauge basic2
Exemple de jauge basic
Carte des états unis colorisée
Carte de l'Europe colorisée
Exemple de barres avec gradient de couleur
Anneau avec fond de couleur dégradé, couleur sous la légende, polices modifiées
Exemple de courbe de Bézier (SPLine) avec gradient de couleur et droite de régression
Exemple de barres avec des apparences spécifiques pour certaines
