API version 1
- ‐
Chart¶
高機能グラフを表現するクラスです。
典型的な利用方法¶
チャートの種類を指定して初期化し、どのようなグラフを表示させるかを決定します。
初期化すると対応する種類のデータ系列を追加できるため、追加したいデータ系列を指定します。
データ系列にデータを追加します。データの追加は ChartSeries.load メソッドが便利です。
最後に、 relayout メソッドを呼んでデータの表示範囲を自動調整します。手動で調整することもできます。
/* 1.初期化 */
Chart testChart(Chart.CHARTTYPE_XY){
Width = 700;
Height = 600;
Function initChart(){
/* 2.折れ線グラフ作成 */
var cs = createSeries(Chart.SERIESTYPE_LINE);
/* 3.CSVデータを読み込み */
cs.load(^.csvdata);
/* 4.データの表示範囲を自動調整 */
relayout();
}
}
testChart.initChart();
チャートの種類¶
Chartオブジェクトは、初期化時にどのデータ系列を追加して表示できるかが予め決まっています。 例えば、棒グラフの種類を指定して初期化されたChartは円グラフなどを追加することができません。 また、円グラフの種類を指定して初期化されたChartは2個以上の円グラフのデータ系列を追加することができない等、特殊な制限があるものもあります。
チャートの種類には下記のようなものがあります。
定数名 |
種類名 |
軸 |
使用可能クラス |
備考(制限など) |
|---|---|---|---|---|
CHARTTYPE_XY |
XYグラフ |
ChartValueAxis (縦/横)
|
特になし
|
|
CHARTTYPE_PIE |
円グラフ |
なし
|
ChartPieSeries は1個まで
|
|
CHARTTYPE_BAR |
棒グラフ |
ChartValueAxis (縦)
ChartStringAxis (横)
|
ChartBarSeries は1個まで
|
|
CHARTTYPE_MULTI |
2軸マルチグラフ |
ChartBarSeries は1個まで
|
データ系列とアイテムのクラス構成・データ形式¶
データ系列は、内部で保持するデータの構成単位や、その要素にアクセスするためのクラス階層が種類によって大きく異なります。データを直接操作する場合は、下記の対応関係を把握しておく必要があります。
データ系列のクラス階層
ChartSeries (抽象クラス)
├─ ChartXYSeries (抽象クラス)
│ ├─ ChartLineSeries
│ ├─ ChartScatterSeries
│ └─ ChartSplineSeries
├─ ChartBarSeries (抽象クラス)
│ ├─ ChartStandardBarSeries
│ ├─ ChartStackedBarSeries
│ └─ ChartPercentBarSeries
└─ ChartPieSeries
いずれの派生クラスもスクリプトから直接 new することはできず、 createSeries メソッドで生成します。
系列の種類ごとのデータ保持構造
データ系列 |
データの構成単位 |
対応するアイテムクラス |
利用可能な操作メソッド |
備考 |
|---|---|---|---|---|
座標(x,y)の組 |
なし(アイテムクラスを持たない) |
addItem / insertItem / removeItem / getItems |
1点=1組の(x,y)。 getItems はRecord{x[],y[]}形式で全点を一括取得します。getItem(index)のような単一点取得メソッドはありません。点ごとの色やラベル等の個別プロパティは持たず、系列単位のプロパティ(color, width等)のみです。 |
|
バーセット( load での1行に対応する値の配列) |
addItem / getItem / getItems / removeItem |
1つの ChartBarItem は「1本のバー」ではなく「1つの凡例項目(=loadでの1行)」に対応し、内部にさらにカテゴリ数分の値の配列を持つ二重構造です。ChartBarItem自身が add/insert/at/remove/replace/truncate で内部の値配列を管理します。 |
||
スライス1個分のラベルと値 |
addItem / insertItem / getItem / getItems / removeItem |
1つの ChartPieItem が円グラフの1スライスに対応するシンプルな1対1構造で、内部に配列は持ちません。 |
上表の「利用可能な操作メソッド」は系列の種類によって微妙に異なります(例: XY系列はgetItemを持たずgetItemsのみ、Bar系列はinsertItemを持たない等)。詳細は各系列クラスのmethods一覧を参照してください。
loadメソッドとの対応
ChartSeries.load に渡すtable型データ(CSVDocument等)の1行が、上表の「データの構成単位」1つに対応します。列構成の詳細は ChartSeries.load を参照してください。
軸とデータ系列の紐付け¶
createSeries メソッドで軸を明示的に指定しなかった場合、下記のルールに従って自動的に既存の軸(無ければ新規作成した軸)へ紐付けられます。
データ系列 |
横軸(X) |
縦軸(Y) |
|---|---|---|
ChartStandardBarSeries 等の棒グラフ系列 |
既存の縦軸のうち最初に見つかったもの |
|
ChartLineSeries 等のXY系列 |
既存の横軸のうち最初に見つかったもの |
既存の縦軸のうち最初に見つかったもの |
(紐付けなし) |
(紐付けなし) |
/* 右軸に折れ線グラフを紐付ける例 */
var xAxis = testChart.getAxis(Chart.AXISALIGN_BOTTOM);
var yAxisR = testChart.getAxis(Chart.AXISALIGN_RIGHT);
var cs = createSeries(Chart.SERIESTYPE_LINE, xAxis, yAxisR);
CHARTTYPE_MULTIにおける横軸(ChartStringAxis)の項目について¶
CHARTTYPE_MULTIの横軸は ChartStringAxis (カテゴリ軸)固定です。 この軸の項目(カテゴリ)は、 relayout メソッドを実行したタイミングで、横軸に紐付いている 棒グラフ系列(ChartBarSeries派生クラス)のデータ数 をもとに "0","1","2",... という連番の文字列として自動的に生成し直されます。
回避方法・運用上の注意
棒グラフ系列(BAR/STACKEDBAR/PERCENTBAR)を先に作成してデータをloadしてから、折れ線グラフ等のXY系列を作成する
XY系列側のX値(load()する数値データの1列目)には、カテゴリの連番(0,1,2,...)に対応する値を指定する
連番ではなく意味のあるラベル(月名など)を表示したい場合は、relayout実行後に ChartStringAxis.strings プロパティへ配列を設定して上書きする(サンプル
ChartStrings.crsを参照)。ただし、strings設定後に再度relayoutを実行すると連番文字列に上書きされてしまう点に注意してください。
デフォルトプロパティ¶
Chartクラスにはデフォルトプロパティはありません。