Définition de graphique à l'aide de JSON

Au lieu de coder vous-même un graphique dynamique, vous pouvez fournir une description simple du graphique. Les graphiques dynamiques peuvent être conçus et entièrement définis par une seule source de données ; JSON est actuellement le format de source de données préféré, mais XML et d'autres seront disponibles à l'avenir.

Vous définissez le graphique en fournissant une structure de données JSON simple qui adhère au schéma DynamicChart. Le schéma est disponible dans le Compositeur de Schéma . Il est également facilement visible dans le Paquetage de graphiques dynamiques du Modèle d'exemple Enterprise Architect .

(Pour afficher le schéma DynamicChart, sélectionnez Développer > Modélisation de schéma > Compositeur de Schéma > Ouvrir Compositeur de Schéma , cliquez sur le bouton Browse. dans le champ « Profil » et sélectionnez DynamicChartSchema.)

Sources de données - JSON

Pour afficher un graphique à l'aide d'une structure de données JSON, sélectionnez d'abord l'élément Artefact DynamicChart, puis ouvrez l'éditeur de « code interne ». Pour une sélection dans le Navigateur , cliquez-droit et choisissez « Fonctionnalités > Modifier le code interne » ou, pour une sélection sur un diagramme , cliquez-droit et choisissez « Modifier le script du graphique ». Cela ouvrira l'éditeur pour que vous puissiez éditer le script du graphique. Créez une variable JSON qui définit le graphique à afficher, puis composez votre fonction ConstructChart.

La fonction ConstructChart prend comme argument unique l'identité (une string GUID) de l'élément Chart affiché sur le diagramme d'ouverture. Vous appelez ensuite la fonction intégrée ConstructChartFromJSON, en passant le GUID comme premier paramètre et la structure JSON comme deuxième argument, comme illustré dans cet exemple :

Example Datasource in JSON

var barChart2DJSON =
{
"Category" : "BarSmart",
"Type" : "Simple",
"Title" : "Vehicle Expenses",
"Series" :
[
{
"Label" : "Fuel",
"Data":
{
"Type" : "Column",
"Points" :
[
{ "Category": "Jan", "Y": 1.0 },
{ "Category": "Feb", "Y": 3.0 },
{ "Category": "Mar", "Y": 7.0 },
{ "Category": "Apr", "Y": 8.0 },
{ "Category": "May", "Y": 10.0 },
{ "Category": "Jun", "Y": 15.0 }
]
}
},
{
"Label" : "Taxes",
"Data":
{
"Type" : "Normal",
"Points" :
[
{ "Y":10.0 },
{ "Y":12.0 },
{ "Y":16.0 },
{ "Y":17.0 },
{ "Y":10.0 },
{ "Y":12.0 }
]
}
},
{
"Label" : "Maintenance",
"Data":
{
"Type" : "Normal",
"Points" :
[
{ "Y":5.0 },
{ "Y":2.0 },
{ "Y":6.0 },
{ "Y":7.0 },
{ "Y":1.0 },
{ "Y":2.0 }
]
}
},
{
"Label" : "Other",
"Data":
{
"Type" : "Normal",
"Points" :
[
{ "Y":2.5 },
{ "Y":2.5 },
{ "Y":2.5 },
{ "Y":2.5 },
{ "Y":2.5 },
{ "Y":2.5 }
]
}
}
]
};

function ConstructChart(chartGuid)
{
ConstructChartFromJSON(chartGuid, barChart2DJSON);
}

Autres exemples

D'autres exemples JSON sont fournis dans le Modèle d'exemple (voir le Paquetage ' Rapportage > Graphiques > Graphiques dynamiques').

Chaque exemple de graphique fournit un diagramme de tableau de bord et un élément DynamicChart. Sélectionnez un élément dans l'un de ces exemples et appuyez sur « Alt+7 » pour afficher le comportement derrière le graphique. Regarder la variété d'exemples de graphiques est la meilleure façon de savoir comment utiliser JSON pour produire les types de graphiques qui pourraient vous intéresser.