データのクラスタリング

この概念は、縦棒と横棒型の系列のみに適用されます。

縦棒グラフまたは横棒グラフが Y 軸で複数のseriesをサポートする場合、X 軸では１つのデータセットのみ使用できます。この方法により、たとえば X 軸の自動車メーカーごとに Y 軸で複数年の販売データをレポートできます。こうしたデータを提供する場合、グラフには、Honda のすべてのデータを示す棒のクラスタ、Nissan を示す別のクラスタなど、データをクラスタにまとめて表示します。

このようなタイプのグラフをコード化する方法はいくつかあります。

seriesList ごとにすべての X 軸データをリスト

冗長な X データ	コードのコピー
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#wijcompositechart").wijcompositechart({ clusterOverlap: 50, seriesList: [ { type: "column", label: "2012 Auto Sales", data: { x: ['Ford', 'GM', 'Chrysler', 'Toyota', 'Nissan', 'Honda'], y: [.05, .04, .21, .27, .1, .24] } }, { type: "column", label: "2011 Auto Sales", data: { x: ['Ford', 'GM', 'Chrysler', 'Toyota', 'Nissan', 'Honda'], y: [.17, .19, .12, -.06, .17, -.07] } }, { type: "pie", center: { x: 100, y: 75 }, radius: 60, data: [ {label: "Ford", data: 15}, {label: "GM", data: 17.4}, {label: "Chrysler", data: 10.9}, {label: "Toyota", data: 14.3}, {label: "Nissan", data: 8.5}, {label: "Honda", data: 10.1}, {label: "Other", data: 23.8}] }] }); }); </script>

この方法は少し冗長であるため、次のようにすべての X データを一箇所に記述する簡単な方法があります：

すべての X データを１つの場所に配置

デフォルト値	コードのコピー
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#wijcompositechart").wijcompositechart({ clusterOverlap: 50, data: {x: ['Ford', 'GM', 'Chrysler', 'Toyota', 'Nissan', 'Honda']}, seriesList: [ { type: "column", label: "2012 Auto Sales", data: { y: [.05, .04, .21, .27, .1, .24] } }, { type: "column", label: "2011 Auto Sales", data: { y: [.17, .19, .12, -.06, .17, -.07] } }, { type: "pie", center: { x: 100, y: 75 }, radius: 60, data: [ {label: "Ford", data: 15}, {label: "GM", data: 17.4}, {label: "Chrysler", data: 10.9}, {label: "Toyota", data: 14.3}, {label: "Nissan", data: 8.5}, {label: "Honda", data: 10.1}, {label: "Other", data: 23.8}] }] }); }); </script>

Wijmo は、これらのデータクラスタの表示方法を制御できるいくつかのオプションを提供します：

関連トピック

参照