SGR Generate PolarGraph : Différence entre versions

De BlueWiki
 
(18 révisions intermédiaires par un utilisateur sont masquées)
Ligne 1 : Ligne 1 :
 +
[[Composant_Graphe_SVG#Commandes|Liste des commandes du composant]]
 +
 +
[[SGR_Generate_PolarGraph-EN|English version of this page]] [[File:icone_drapeau-anglais.jpg]]
 +
=== Paramètres ===
 +
----
 
{| class="wikitable"  
 
{| class="wikitable"  
 
!Paramètres
 
!Paramètres
 
!Type
 
!Type
 
!
 
!
 +
!N° du paramètre
 
!Description
 
!Description
 +
 
|-
 
|-
|valign="top"|axes
+
|valign="top"|Nom des paramètre du graphe
 
|valign="top"|Pointeur
 
|valign="top"|Pointeur
 
|valign="top"|[[File:in.png|caption]]
 
|valign="top"|[[File:in.png|caption]]
|Pointeur vers un tableau texte des noms des axes (minimum 3)
+
|valign="top" align="center"|1
 +
|Pointeur vers un tableau texte qui contient le nom des paramètres, ce tableau doit avoir la même taille que le tableau des valeurs de paramètres du graphe
 +
 
 +
Les valeurs possible de paramètre du graphe sont les suivantes :
 +
 
 +
Paramètres généraux du graphe
 +
* "Police du graphe" ou "GraphFont" : Police du titre et polices par défaut des légendes et des échelles (arial par défaut)
 +
* "Affichage des axes" ou "ShowAxis" : "yes", "oui", "non" ou "no" (defaut :"yes")
 +
* "Couleur du fond du cercle" ou "CircleBGColor" : Couleur du fond du cercle du graphe (defaut :"White")
 +
* "Couleur du périmètre" ou "PerimeterColor" : Couleur du périmètre du cercle du graphe (defaut :"black")
 +
* "ConcentricCirclesColor" : couleur des cercles concentriques d'échelle (defaut si aucune veleur n'est passée :"Pink:10") pour le pas l'afficher passer une valeur vide ""
 +
* "ScaleUnit" ou "Unité" : unité des graduation radiales : radian, grade, rose des vents(fantail) ou degré(degree) (défaut :"degré")
 +
* "PerimeterGraduation" ou "Graduation périmétrique" : Affichage des graguations périmétriques
 +
* graduation radiale de 10 en 10 (oui / Non)
 +
* "LegendLanguage" ou "Langue de la légende" : Utilisé pour l'affichage sur le pourtour du cercle en cas de rose des vents : french ou english (défaut : "French")
 +
* "Couleur de fond du graphe" ou "GraphBGColor" : Couleur du fond du graphe
 +
* "Couleur 2 de fond du graphe" ou "GraphBGColor2" : Deuxième couleur du fond du graphe, si vous spécifiez une deuxième couleur et quelle est différente de la première vous obtiendrez un dégradé
 +
 
 +
 
 +
Paramètres du titre
 +
* "Titre" ou "Title" : titre du graphe
 +
* "alignement du titre" ou "TitleAlignement" : Alignement du titre 0,1,2,3
 +
* "TitleFontSize" ou "Taille de la police du titre" : Taille de la police du titre
 +
* "TitleFontStyle" ou "Style de la police du titre" : Style de la police du titre (ex chaine(gras+italique))
 +
* "TitleFontColor" ou "Couleur de la police du titre" : Couleur de la police du titre
 +
* "TitleVerticalOffSet" ou "Décalage vertical du titre" : Décalage vertical en px pour un ajustement fin de sa position
 +
 
 +
 
 +
Paramètres de la légende
 +
* "Affichage de la légende" ou "ShowLegend" : Affichage de la légende "oui", "vrai", "true", "yes", "non", "no", "Faux", "false"
 +
* "Police de la légende" ou "legendFont" : Police de la légende, si cette valeur est passée, elle remplace la "police du graphe"
 +
* "LegendFontSize" ou "Taille de la police de la légende" : Taille de la police de la légende
 +
* "LegendFontStyle" ou "Style de la police de la légende" : Style de la police de la légende
 +
* "LegendFontColor" ou "Couleur de la police de la légende" : Couleur de la police de la légende
 +
* "LegendBGcolor" ou "Couleur de fond de la légende" : Couleur de fond du rectangle de légende ("White:0" pour une transparence)
 +
 
 +
 
 
|-
 
|-
|valign="top"|DataGraphe
+
|valign="top"|valeurs des paramètre du graphe
 
|valign="top"|Pointeur
 
|valign="top"|Pointeur
 
|valign="top"|[[File:in.png|caption]]
 
|valign="top"|[[File:in.png|caption]]
|Pointeur vers un tableau texte des paramètres du graphe
+
|valign="top" align="center"|2
#Titre du graphe
+
|Pointeur vers un tableau texte valeurs des paramètres du graphe
#Taille de la police du Titre
+
 
#Couleur du fond
+
|-
#Affichage des échelles (oui/non)
+
|valign="top"|Données des série
 +
|valign="top"|Pointeur
 +
|valign="top"|[[File:in.png|caption]]
 +
|valign="top" align="center"|3
 +
|Pointeur vers un tableau texte des paramètres de série
 +
#Nom
 +
#Couleur
 +
#Symbole (rond, carré, triangle, étoile)
 +
 
 
|-
 
|-
 
|valign="top"|DataSerie
 
|valign="top"|DataSerie
 
|valign="top"|Pointeur
 
|valign="top"|Pointeur
 
|valign="top"|[[File:in.png|caption]]
 
|valign="top"|[[File:in.png|caption]]
 +
|valign="top" align="center"|4
 
|Pointeur vers un tableau texte à 2 dimensions des paramètres des séries
 
|Pointeur vers un tableau texte à 2 dimensions des paramètres des séries
  
 
|-
 
|-
|valign="top"|Value
+
|valign="top"|Distances
 
|valign="top"|Pointeur
 
|valign="top"|Pointeur
 
|valign="top"|[[File:in.png|caption]]
 
|valign="top"|[[File:in.png|caption]]
|Pointeur vers un tableau réel des valeurs entre 0 et 100
+
|valign="top" align="center"|5
*Le premier indice correspond à la série et le deuxieme à l'axe
+
|Pointeur vers un tableau réel des distances par rapport au centre
*Ce tableau doit etre dimensionné ainsi : TABLEAU REEL(Value;NbreDeSeries;NbreAxes)
+
 
 +
|-
 +
|valign="top"|angles
 +
|valign="top"|Pointeur
 +
|valign="top"|[[File:in.png|caption]]
 +
|valign="top" align="center"|6
 +
|Pointeur vers un tableau réel des angles en degrés
  
 
|-
 
|-
Ligne 36 : Ligne 94 :
 
|valign="top"|Image
 
|valign="top"|Image
 
|valign="top"|[[File:out.png|caption]]
 
|valign="top"|[[File:out.png|caption]]
 +
|valign="top" align="center"|
 
|Image incluant le code SVG
 
|Image incluant le code SVG
  
Ligne 43 : Ligne 102 :
 
----
 
----
 
Vous pouvez changer les symboles, les couleurs pour chaque série
 
Vous pouvez changer les symboles, les couleurs pour chaque série
Vous pouvez Afficher des graduation en degrés, radians ou grades ou demander une rose des vents
+
 
 +
Vous pouvez afficher des graduation en degrés, radians ou grades ou demander une rose des vents
  
 
=== Exemple de code===
 
=== Exemple de code===
Ligne 58 : Ligne 118 :
 
   
 
   
 
   // Définition des paramètre de dessin génériques du graphe
 
   // Définition des paramètre de dessin génériques du graphe
 +
TABLEAU TEXTE($DataGrapheName;0)
 
  TABLEAU TEXTE($DataGraphe;0)
 
  TABLEAU TEXTE($DataGraphe;0)
 +
AJOUTER A TABLEAU($DataGrapheName;"Title")
 
  AJOUTER A TABLEAU($DataGraphe;"Répartition des ressources autour de chez vous")  // 1 - titre du graphe
 
  AJOUTER A TABLEAU($DataGraphe;"Répartition des ressources autour de chez vous")  // 1 - titre du graphe
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"TitleAlignement")
 +
AJOUTER A TABLEAU($DataGraphe;Chaine(Centré))  // 4 - Alignement du Titre du graphe
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"FontSize")
 
  AJOUTER A TABLEAU($DataGraphe;"30")  // 2 - taille du libellé
 
  AJOUTER A TABLEAU($DataGraphe;"30")  // 2 - taille du libellé
  AJOUTER A TABLEAU($DataGraphe;"White")  // 3 - couleur du fond
+
 +
AJOUTER A TABLEAU($DataGrapheName;"GraphBGColor")
 +
  AJOUTER A TABLEAU($DataGraphe;"Lightgrey")  // 3 - couleur du fond
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"ShowLegend")
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 4 - Echelle
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 4 - Echelle
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"ShowAxis")
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 5 - Affichage des axes
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 5 - Affichage des axes
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 6 - Affichage des graguations périmétriques
+
 +
AJOUTER A TABLEAU($DataGrapheName;"PerimeterGraduation")
 +
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 6 - Affichage des graduations périmétriques
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"PerimeterColor")
 
  AJOUTER A TABLEAU($DataGraphe;"Blue")  // 7 - couleur du périmetre du cercle
 
  AJOUTER A TABLEAU($DataGraphe;"Blue")  // 7 - couleur du périmetre du cercle
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"CircleBGColor")
 
  AJOUTER A TABLEAU($DataGraphe;"blue:10")  // 8 - couleur du fond du cercle
 
  AJOUTER A TABLEAU($DataGraphe;"blue:10")  // 8 - couleur du fond du cercle
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"ConcentricCirclesColor")
 
  AJOUTER A TABLEAU($DataGraphe;"purple:5")  // 9 - couleur des cercles concentriques d'échelle
 
  AJOUTER A TABLEAU($DataGraphe;"purple:5")  // 9 - couleur des cercles concentriques d'échelle
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"CircleBGColor")
 +
Si (gradRad=1)
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 10 - graduation radiale de 10 en 10
 
  AJOUTER A TABLEAU($DataGraphe;"oui")  // 10 - graduation radiale de 10 en 10
 +
Sinon
 +
AJOUTER A TABLEAU($DataGraphe;"non")  // 10 - graduation radiale de 10 en 10
 +
Fin de si
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"ScaleUnit")
 +
Au cas ou
 +
: (naturegrad=1)
 +
AJOUTER A TABLEAU($DataGraphe;"degré")  // 11 - graduation radiale de 10 en 10 en degré
 +
: (naturegrad=2)
 +
AJOUTER A TABLEAU($DataGraphe;"radian")  // 11 - graduation radiale de 10 en 10 en radian
 +
: (naturegrad=3)
 +
AJOUTER A TABLEAU($DataGraphe;"grade")  // 11 - graduation radiale de 10 en 10 en grade
 +
: (naturegrad=4)
 
  AJOUTER A TABLEAU($DataGraphe;"rose des vents")  // 11 - graduation radiale en rose des vents
 
  AJOUTER A TABLEAU($DataGraphe;"rose des vents")  // 11 - graduation radiale en rose des vents
 +
Sinon
 +
AJOUTER A TABLEAU($DataGraphe;"degré")  // 11 - graduation radiale de 10 en 10 en degré
 +
Fin de cas
 +
 +
AJOUTER A TABLEAU($DataGrapheName;"GraphFont")
 +
AJOUTER A TABLEAU($DataGraphe;"times")  // 12 - Police du graphe
 +
 
   
 
   
 
  TABLEAU TEXTE(DataSerie;3;3)
 
  TABLEAU TEXTE(DataSerie;3;3)
Ligne 82 : Ligne 186 :
 
  DataSerie{3}{1}:="Services de secours"
 
  DataSerie{3}{1}:="Services de secours"
 
  DataSerie{3}{2}:="red"
 
  DataSerie{3}{2}:="red"
  DataSerie{3}{3}:="carré"  // marque : carré/rond/triangle
+
  DataSerie{3}{3}:="étoile"  // marque : carré/rond/triangle
 
   
 
   
 
   // définition du tableau à 2 dimensions des distances
 
   // définition du tableau à 2 dimensions des distances
Ligne 116 : Ligne 220 :
 
  angles{3}{2}:=60
 
  angles{3}{2}:=60
 
   
 
   
  TheGraphe:=SGR_Generate_PolarGraph (->$DataGraphe;->DataSerie;->Distance;->angles)
+
  TheGraphe:=SGR_Generate_PolarGraph (->$DataGrapheName;->$DataGraphe;->DataSerie;->Distance;->angles)
+
 
 
<gallery>
 
<gallery>
 
Fichier:polargraph-ex1.jpg|Image correspondant à l'exemple de code ci-dessus
 
Fichier:polargraph-ex1.jpg|Image correspondant à l'exemple de code ci-dessus
 
</gallery>
 
</gallery>

Version actuelle en date du 1 décembre 2014 à 07:35

Liste des commandes du composant

English version of this page Icone drapeau-anglais.jpg

[modifier] Paramètres


Paramètres Type N° du paramètre Description
Nom des paramètre du graphe Pointeur caption 1 Pointeur vers un tableau texte qui contient le nom des paramètres, ce tableau doit avoir la même taille que le tableau des valeurs de paramètres du graphe

Les valeurs possible de paramètre du graphe sont les suivantes :

Paramètres généraux du graphe

  • "Police du graphe" ou "GraphFont" : Police du titre et polices par défaut des légendes et des échelles (arial par défaut)
  • "Affichage des axes" ou "ShowAxis" : "yes", "oui", "non" ou "no" (defaut :"yes")
  • "Couleur du fond du cercle" ou "CircleBGColor" : Couleur du fond du cercle du graphe (defaut :"White")
  • "Couleur du périmètre" ou "PerimeterColor" : Couleur du périmètre du cercle du graphe (defaut :"black")
  • "ConcentricCirclesColor" : couleur des cercles concentriques d'échelle (defaut si aucune veleur n'est passée :"Pink:10") pour le pas l'afficher passer une valeur vide ""
  • "ScaleUnit" ou "Unité" : unité des graduation radiales : radian, grade, rose des vents(fantail) ou degré(degree) (défaut :"degré")
  • "PerimeterGraduation" ou "Graduation périmétrique" : Affichage des graguations périmétriques
  • graduation radiale de 10 en 10 (oui / Non)
  • "LegendLanguage" ou "Langue de la légende" : Utilisé pour l'affichage sur le pourtour du cercle en cas de rose des vents : french ou english (défaut : "French")
  • "Couleur de fond du graphe" ou "GraphBGColor" : Couleur du fond du graphe
  • "Couleur 2 de fond du graphe" ou "GraphBGColor2" : Deuxième couleur du fond du graphe, si vous spécifiez une deuxième couleur et quelle est différente de la première vous obtiendrez un dégradé


Paramètres du titre

  • "Titre" ou "Title" : titre du graphe
  • "alignement du titre" ou "TitleAlignement" : Alignement du titre 0,1,2,3
  • "TitleFontSize" ou "Taille de la police du titre" : Taille de la police du titre
  • "TitleFontStyle" ou "Style de la police du titre" : Style de la police du titre (ex chaine(gras+italique))
  • "TitleFontColor" ou "Couleur de la police du titre" : Couleur de la police du titre
  • "TitleVerticalOffSet" ou "Décalage vertical du titre" : Décalage vertical en px pour un ajustement fin de sa position


Paramètres de la légende

  • "Affichage de la légende" ou "ShowLegend" : Affichage de la légende "oui", "vrai", "true", "yes", "non", "no", "Faux", "false"
  • "Police de la légende" ou "legendFont" : Police de la légende, si cette valeur est passée, elle remplace la "police du graphe"
  • "LegendFontSize" ou "Taille de la police de la légende" : Taille de la police de la légende
  • "LegendFontStyle" ou "Style de la police de la légende" : Style de la police de la légende
  • "LegendFontColor" ou "Couleur de la police de la légende" : Couleur de la police de la légende
  • "LegendBGcolor" ou "Couleur de fond de la légende" : Couleur de fond du rectangle de légende ("White:0" pour une transparence)


valeurs des paramètre du graphe Pointeur caption 2 Pointeur vers un tableau texte valeurs des paramètres du graphe
Données des série Pointeur caption 3 Pointeur vers un tableau texte des paramètres de série
  1. Nom
  2. Couleur
  3. Symbole (rond, carré, triangle, étoile)
DataSerie Pointeur caption 4 Pointeur vers un tableau texte à 2 dimensions des paramètres des séries
Distances Pointeur caption 5 Pointeur vers un tableau réel des distances par rapport au centre
angles Pointeur caption 6 Pointeur vers un tableau réel des angles en degrés
Resultat Image caption Image incluant le code SVG

[modifier] Description


Vous pouvez changer les symboles, les couleurs pour chaque série

Vous pouvez afficher des graduation en degrés, radians ou grades ou demander une rose des vents

[modifier] Exemple de code


 // Nom utilisateur (OS) : Paul Kuhn - BlueCompany
 // ----------------------------------------------------
 // Méthode : Exemple_DiagrammePolaire
 // Description
 // 
 //
 // Paramètres
 // ----------------------------------------------------


 // Définition des paramètre de dessin génériques du graphe
TABLEAU TEXTE($DataGrapheName;0)
TABLEAU TEXTE($DataGraphe;0)
AJOUTER A TABLEAU($DataGrapheName;"Title")
AJOUTER A TABLEAU($DataGraphe;"Répartition des ressources autour de chez vous")  // 1 - titre du graphe

AJOUTER A TABLEAU($DataGrapheName;"TitleAlignement")
AJOUTER A TABLEAU($DataGraphe;Chaine(Centré))  // 4 - Alignement du Titre du graphe

AJOUTER A TABLEAU($DataGrapheName;"FontSize")
AJOUTER A TABLEAU($DataGraphe;"30")  // 2 - taille du libellé

AJOUTER A TABLEAU($DataGrapheName;"GraphBGColor")
AJOUTER A TABLEAU($DataGraphe;"Lightgrey")  // 3 - couleur du fond

AJOUTER A TABLEAU($DataGrapheName;"ShowLegend")
AJOUTER A TABLEAU($DataGraphe;"oui")  // 4 - Echelle

AJOUTER A TABLEAU($DataGrapheName;"ShowAxis")
AJOUTER A TABLEAU($DataGraphe;"oui")  // 5 - Affichage des axes

AJOUTER A TABLEAU($DataGrapheName;"PerimeterGraduation")
AJOUTER A TABLEAU($DataGraphe;"oui")  // 6 - Affichage des graduations périmétriques

AJOUTER A TABLEAU($DataGrapheName;"PerimeterColor")
AJOUTER A TABLEAU($DataGraphe;"Blue")  // 7 - couleur du périmetre du cercle

AJOUTER A TABLEAU($DataGrapheName;"CircleBGColor")
AJOUTER A TABLEAU($DataGraphe;"blue:10")  // 8 - couleur du fond du cercle

AJOUTER A TABLEAU($DataGrapheName;"ConcentricCirclesColor")
AJOUTER A TABLEAU($DataGraphe;"purple:5")  // 9 - couleur des cercles concentriques d'échelle

AJOUTER A TABLEAU($DataGrapheName;"CircleBGColor")
Si (gradRad=1)
AJOUTER A TABLEAU($DataGraphe;"oui")  // 10 - graduation radiale de 10 en 10
Sinon 
AJOUTER A TABLEAU($DataGraphe;"non")  // 10 - graduation radiale de 10 en 10
Fin de si 

AJOUTER A TABLEAU($DataGrapheName;"ScaleUnit")
Au cas ou 
: (naturegrad=1)
AJOUTER A TABLEAU($DataGraphe;"degré")  // 11 - graduation radiale de 10 en 10 en degré
: (naturegrad=2)
AJOUTER A TABLEAU($DataGraphe;"radian")  // 11 - graduation radiale de 10 en 10 en radian
: (naturegrad=3)
AJOUTER A TABLEAU($DataGraphe;"grade")  // 11 - graduation radiale de 10 en 10 en grade
: (naturegrad=4)
AJOUTER A TABLEAU($DataGraphe;"rose des vents")  // 11 - graduation radiale en rose des vents
Sinon 
AJOUTER A TABLEAU($DataGraphe;"degré")  // 11 - graduation radiale de 10 en 10 en degré
Fin de cas 

AJOUTER A TABLEAU($DataGrapheName;"GraphFont")
AJOUTER A TABLEAU($DataGraphe;"times")  // 12 - Police du graphe


TABLEAU TEXTE(DataSerie;3;3)
DataSerie{1}{1}:="Cinema"
DataSerie{1}{2}:="Purple"
DataSerie{1}{3}:="rond"  // marque : carré/rond/triangle

DataSerie{2}{1}:="Station essence"
DataSerie{2}{2}:="blue"
DataSerie{2}{3}:="triangle"  // marque : carré/rond/triangle

DataSerie{3}{1}:="Services de secours"
DataSerie{3}{2}:="red"
DataSerie{3}{3}:="étoile"  // marque : carré/rond/triangle

 // définition du tableau à 2 dimensions des distances
TABLEAU REEL(Distance;0;0)
TABLEAU REEL(Distance;3;5)
Distance{1}{1}:=5
Distance{1}{2}:=30
Distance{1}{3}:=70

Distance{2}{1}:=20
Distance{2}{2}:=47
Distance{2}{3}:=20
Distance{2}{4}:=40
Distance{2}{5}:=60

Distance{3}{1}:=40
Distance{3}{2}:=65

 // définition du tableau à 2 dimensions des angles
TABLEAU REEL(angles;0;0)
TABLEAU REEL(angles;3;5)
angles{1}{1}:=405
angles{1}{2}:=220
angles{1}{3}:=330

angles{2}{1}:=290
angles{2}{2}:=30
angles{2}{3}:=150
angles{2}{4}:=65
angles{2}{5}:=180

angles{3}{1}:=335
angles{3}{2}:=60

TheGraphe:=SGR_Generate_PolarGraph (->$DataGrapheName;->$DataGraphe;->DataSerie;->Distance;->angles)