#直線軸
線形スケールは、数値データをグラフ化するために使用されます。 X 軸または Y 軸のいずれかに配置できます。散布図タイプでは、これらの目盛のいずれかを X 軸に使用するように折れ線グラフが自動的に構成されます。名前が示すように、線形補間は、値が軸上のどこにあるかを決定するために使用されます。
#構成オプション
#直線軸固有のオプション
名前空間:options.scales[scaleId]
名前 | タイプ | 説明 |
---|---|---|
beginAtZero | boolean | true の場合、スケールにはまだ含まれていない場合は 0 が含まれます。 |
grace | number |string | パーセンテージ (で終わる文字列)% データの上下のスケール範囲に追加される部屋の量 (数値) または量 (数値)。もっと... |
#すべてのデカルト軸に共通のオプション
名前空間:options.scales[scaleId]
名前 | タイプ | デフォルト | 説明 |
---|---|---|---|
bounds | string | 'ticks' | スケールの境界を決定します。もっと... |
position | string |object | 軸の位置。もっと... | |
stack | string | スタックグループ。同じ軸position 同じようにstack 積み重ねられています。 | |
stackWeight | number | 1 | スタックグループ内のスケールの重量。グループ内のスケールに割り当てられたスペースの量を決定するために使用されます。 |
axis | string | これはどのタイプの軸ですか。可能な値は次のとおりです。'x' 、'y' 。設定されていない場合、これは ID の最初の文字から推測されます。'x' また'y' 。 | |
offset | boolean | false | true の場合、余分なスペースが両端に追加され、グラフ領域に収まるように軸が拡大縮小されます。これは次のように設定されていますtrue デフォルトで棒グラフの場合。 |
title | object | スケールタイトル構成。もっと... |
#全軸共通オプション
名前空間:options.scales[scaleId]
名前 | タイプ | デフォルト | 説明 |
---|---|---|---|
type | string | 使用されているスケールの種類。カスタム スケールを作成し、文字列キーを使用して登録できます。これにより、グラフの軸のタイプを変更できます。 | |
alignToPixels | boolean | false | ピクセル値をデバイスのピクセルに合わせます。 |
backgroundColor | Color | スケール領域の背景色。 | |
border | object | 境界線の構成。もっと... | |
display | boolean |string | true | 軸のグローバル可視性を制御します (次の場合に表示されます)。true 、いつ隠されるかfalse )。いつdisplay: 'auto' 、軸は、少なくとも 1 つの関連データセットが表示されている場合にのみ表示されます。 |
grid | object | グリッドラインの構成。もっと... | |
min | number | ユーザー定義のスケールの最小値。データの最小値をオーバーライドします。もっと... | |
47fd7e88-c75c-489b-9599-51cf157396d0 | number | ユーザー定義のスケールの最大値。データの最大値をオーバーライドします。もっと... | |
reverse | boolean | false | スケールを逆にします。 |
stacked | boolean |string | false | データをスタックする必要があります。もっと... |
suggestedMax | number | データの最大値を計算するときに使用される調整。もっと... | |
suggestedMin | number | 最小データ値を計算するときに使用される調整。もっと... | |
ticks | object | 設定にチェックマークを付けます。もっと... | |
weight | number | 0 | 軸のソートに使用される重み。重みが大きいほど、チャート領域から遠くなります。 |
#ティック設定
#線形軸固有のティック オプション
名前空間:options.scales[scaleId].ticks
名前 | タイプ | スクリプト可能 | デフォルト | 説明 |
---|---|---|---|---|
count | number | はい | undefined | 生成するティックの数。指定した場合、これは自動生成をオーバーライドします。 |
format | object | はい | のIntl.NumberFormat (新しいウィンドウが開きます)デフォルトのラベルフォーマッタで使用されるオプション | |
precision | number | はい | 定義されていれば、stepSize が指定されていない場合、ステップ サイズはこの小数点以下の桁数に四捨五入されます。 | |
stepSize | number | はい | スケールのユーザー定義の固定ステップ サイズ。もっと... |
#すべてのデカルト軸に共通の目盛オプション
名前空間:options.scales[scaleId].ticks
名前 | タイプ | デフォルト | 説明 |
---|---|---|---|
align | string | 'center' | 軸に沿った目盛りの配置。できる'start' 、'center' 、'end' 、 また'inner' 。inner アライメントとは整列という意味ですstart 最初のティックとend 横軸の最後のティックについて |
crossAlign | string | 'near' | 軸に垂直な目盛りの配置。できる'near' 、'center' 、 また'far' 。見る目盛りの配置 |
sampleSize | number | ticks.length | 適合するラベルの数を決定するときに調べるティックの数。小さい値を設定すると高速になりますが、ラベルの長さに大きなばらつきがある場合は精度が低くなる可能性があります。 |
autoSkip | boolean | true | true の場合、表示できるラベルの数が自動的に計算され、それに応じてラベルが非表示になります。ラベルは次まで回転しますmaxRotation スキップする前に。振り向くautoSkip オフにすると、何があってもすべてのラベルが表示されます。 |
autoSkipPadding | number | 3 | 横軸の目盛り間のパディングautoSkip 有効になっています。 |
includeBounds | boolean | true | 定義されている必要がありますmin とmax 値は、「適切」ではない場合でも、ティックとして表示されます。 |
labelOffset | number | 0 | 目盛の中心点からラベルをオフセットするピクセル単位の距離 (x 軸の場合は x 方向、y 軸の場合は y 方向)。注: これにより、端のラベルがキャンバスの端で切り取られる可能性があります。 |
maxRotation | number | 50 | ラベルを圧縮するために回転する場合の目盛りラベルの最大回転。注: 回転は必要になるまで行われません。注: 水平スケールにのみ適用されます。 |
minRotation | number | 0 | 目盛ラベルの最小回転。注: 水平スケールにのみ適用されます。 |
mirror | boolean | 料金46804-fbc7-4d9a-9931-c814554db6ec | 軸の周囲で目盛ラベルを反転し、ラベルをグラフの外側ではなく内側に表示します。注: 垂直スケールにのみ適用されます。 |
padding | number | 0 | 目盛りラベルと軸の間のパディング。垂直軸に設定すると、これは水平 (X) 方向にも適用されます。水平軸に設定すると、垂直 (Y) 方向にも適用されます。 |
maxTicksLimit | number | 11 | 表示する目盛りとグリッド線の最大数。 |
#すべての軸に共通の目盛オプション
名前空間:options.scales[scaleId].ticks
名前 | タイプ | スクリプト可能 | デフォルト | 説明 |
---|---|---|---|---|
backdropColor | Color | はい | 'rgba(255, 255, 255, 0.75)' | ラベルの背景の色。 |
backdropPadding | Padding | 2 | ラベルの背景のパディング。 | |
callback | function | チャート上に表示されるティック値の文字列表現を返します。見る折り返し電話。 | ||
display | boolean | true | true の場合、目盛りラベルを表示します。 | |
color | Color | はい | Chart.defaults.color | ダニの色。 |
font | Font | はい | Chart.defaults.font | 見るフォント |
major | object | {} | メジャーティックの設定。 | |
padding | number | 090f114b-f013-4d36-b646-46e6866ファファ | 軸からの目盛りラベルのオフセットを設定します。 | |
5d7709de-b6a0-445f-a136-cdfc28abb494 | boolean | はい | true 放射状スケールの場合、false さもないと | true の場合、目盛ラベルの後ろに背景を描画します。 |
textStrokeColor | Color | はい | 「」 | テキストの周囲のストロークの色。 |
textStrokeWidth | number | はい | 0 | テキストの周囲のストロークの幅。 |
z | number | 0 | 目盛りレイヤーの Z インデックス。チャート領域に目盛りを描画する場合に便利です。値 <= 0 はデータセットの下に描画され、値 > 0 は上に描画されます。 |
#刻み幅
設定されている場合、スケール ティックは次の倍数で列挙されます。stepSize
、増分ごとに 1 ティックになります。設定されていない場合、ティックには Nice Number アルゴリズムを使用して自動的にラベルが付けられます。
この例では、目盛りを作成する y 軸を持つグラフを設定します。0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5
。
let options = {
scales: {
y: {
max: 5,
min: 0,
ticks: {
stepSize: 0.5
}
}
}
};
#グレース
値が次で終わる文字列の場合%
、パーセンテージとして扱います。数値の場合は値として扱います。
値は最大データ値に加算され、最小データから減算されます。これにより、データ値が非常に大きいかのようにスケール範囲が拡張されます。
const config = { type: 'bar', data, options: { scales: { y: { type: 'linear', grace: '5%' } }, plugins: { legend: false } } };
#内部データ形式
リニアスケールは内部的に数値データを使用します。
←カテゴリ軸 対数軸→