<< 目次を表示 >> ページ位置: その他の記法のモデリング > チャート > スクリプト連携のチャート > JSONでチャートの内容を定義 |
スクリプト連携のチャートを自分でコーディングする方法の他に、チャートの簡単な利用方法もあります。スクリプト連携のチャートは、単一のデータソースで定義し、その内容を表示できます。
スクリプト連携チャートのスキーマに準拠したシンプルな JSON データ構造に合致するようにチャートを定義します。スキーマは、スキーマコンポーザーでも利用できます。また、Enterprise Architectのサンプルプロジェクにもサンプルが含まれています。
データソース - JSON
JSON データ構造を使用してチャートを描画するには、まず ツールボックスの「チャート」グループに含まれる「スクリプト連携チャート」要素を選択してから、内部のコードエディタを開きます。 モデルブラウザでの選択では、右クリックして「属性と操作」 > 「ソースコードの編集」を選択します。ダイアグラム上の選択では、右クリックして「チャートスクリプトの編集」を選択します。どちらの操作でも、チャートスクリプトを編集するためのエディタを開きます。描画するチャートを定義するJSON変数を作成し、ConstructChart関数を作成します。
ConstructChart関数は、単一の引数として、対象のダイアグラムに表示されているチャート要素のID(GUID文字列)を取ります。次に、組み込み関数ConstructChartFromJSONを呼び出し、第1引数にGUIDを、第2引数に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);
}
その他のサンプル
別のJSONの例は、サンプルプロジェクトに含まれています。
それぞれのサンプル内のチャートのパッケージには、スクリプト連携のチャート図とスクリプト連携のチャート要素が含まれています。これらの例のいずれかから要素を選択し、右クリックメニューの「チャートスクリプトの編集」を選択すると、チャート要素が持つソースコードが表示されます。さまざまなチャートの例を見ることによって、興味のある種類のチャートを作成するためにJSONを使用する方法を知ることができます。