軸(Axes)
更新日: 2019-12-06
軸(Axes)はチャートに必要不可欠な要素です。 軸は、データをどのようにマップするかを決定するために使用します。 直交座標系(CartesianAxis)では、2次元キャンバス上にマップするために、1つ以上のX軸/Y軸があります。 これらの軸は「デカルト軸」として知られています。
ラジアルチャート(RadialChart)では、レーダーチャートや、鶏頭図のように、 角度と半径方向をマップする1本の軸があります。 これは「放射軸」として知られています。
スケールは、ver2.0以上ではver1.0より強力ですが、大きな違いがあります。
- 複数のX軸、Y軸がサポートされています。
- ラベルスキップ機能は、重複した目盛線とラベルを検出し、 正しく表示ために、n番目のラベルを全て削除します。
- スケールのタイトルがサポートされています。
- 新しいチャートタイプを書くことなく、新しいスケールタイプを拡張することができます。
設定
名称 | type | 初期値 | 説明 |
---|---|---|---|
display | boolean|string | true | false の場合、軸が非表示になります。 gridLines.display 、scaleLabel.display 、ticks.display を無視します。 |
callbacks | object | 軸のライフサイクルにフックするコールバックを指定します。 詳しくはこちら | |
weight | number | 0 | 軸をソートするために使用するウェイト。 ウェイトが高いほどチャート領域から離れます。 |
コールバック
更新プロセス中にスケールのパラメータを変更するために、いくつかのコールバックがあります。
名称 | 引数 | 説明 |
---|---|---|
beforeUpdate | axis | 更新プロセス開始前に呼び出されるコールバックです。 |
beforeSetDimensions | axis | 次元が設定される前に呼び出されるコールバックです。 |
afterSetDimensions | axis | 次元が設定された後に呼び出されるコールバックです。 |
beforeDataLimits | axis | データのリミットが決定される前に呼び出されるコールバックです。 |
afterDataLimits | axis | データのリミットが決定された後に呼び出されるコールバックです。 |
beforeBuildTicks | axis | 目盛線を生成する前に呼び出されるコールバックです。 |
afterBuildTicks | axis | 目盛線を生成した後に呼び出されるされるコールバックです。目盛線をフィルタリングするのに便利です。 |
beforeTickToLabelConversion | axis | 目盛線を文字列に変換する前に呼び出されるコールバックです。 |
afterTickToLabelConversion | axis | 目盛線が文字列に変換された後に呼び出されるコールバックです。 |
beforeCalculateTickRotation | axis | 目盛線の角度が決定される前に呼び出されるコールバックです。 |
afterCalculateTickRotation | axis | 目盛線の角度が決定した後に呼び出されるコールバックです。 |
beforeFit | axis | スケールをキャンバスに合わせる前に呼び出されるコールバックです。 |
afterFit | axis | スケールをキャンバスに合わせた後に呼び出されるコールバックです。 |
afterUpdate | axis | 更新プロセスが終了した時に呼び出されるコールバックです。 |
初期値の変更
スケールの初期値変更は、scaleService
を使って簡単に変更することができます。 やることは、新しい設定を現在の設定にマージするために渡すだけです。
例えば、全ての折れ線グラフの最小値を0
にする場合、以下のように指定します。 以下の指定の後に生成された折れ線グラフは、最小値が0
になります。
Chart.scaleService.updateScaleDefaults('linear', {
ticks: {
min: 0
}
});
新しい軸の生成
軸を新しく生成するには、開発者ドキュメントを参照して下さい。
© 2013 Chart.js is available under the MIT license
このコンテンツはChart.jsドキュメントを翻訳/改変したものです。