線形直交軸

線形スケールは、数値データのグラフ化に使用されます。x軸またはy軸のいずれかに使用できます。散布図では、線グラフを基本の型として使用しますが、線グラフのx軸が線形スケールとして自動的に設定されます。この名前(訳注: 線形スケール)が示すように、値が軸上のどこにあるかを決定するために線形補間が使用されます。

目盛設定オプション

以下のオプションは、線形スケールにおいて使用できます。これらはすべて ticksサブオプションにあります。これらのオプションは共通の目盛設定を拡張します。

名前 初期値 説明
beginAtZero Boolean trueの場合、まだ含まれていない場合にはスケールに0が含まれます。
min Number ユーザー定義のスケールの最小数で、データの最小値を上書きします。 詳細...
max Number ユーザー定義のスケールの最大数で、データの最大値を上書きします。 詳細...
maxTicksLimit Number 11 表示する目盛(ticks)とグリッド線(grid lines)の最大数。
precision Number これが定義されており、stepSizeが定義されていない場合は、ステップサイズは、小数部分の桁数がこの値になるように丸められます。(訳注: 3なら12.345などと丸められます。)
stepSize Number ユーザー定義のスケールの固定刻み幅。 詳細...
suggestedMax Number 最大データ値を計算するときに使用される調整値。 詳細...
suggestedMin Number 最小データ値を計算するときに使用される調整値。 詳細...

軸範囲の設定

軸の範囲設定をする際には、それらが互いにどのように相互作用するかを理解することが重要です。

suggestedMaxsuggestedMin設定は、軸をスケールするために使われるデータ値だけを変更します。これらは、自動フィット機能を維持しながら軸の範囲を拡張するのに便利です。

let minDataValue = Math.min(mostNegativeValue, options.ticks.suggestedMin);
let maxDataValue = Math.max(mostPositiveValue, options.ticks.suggestedMax);

この例では、正の最大値は50ですが、データの最大値は100に広げられます。ただし、最も低いデータ値は suggestedMin設定よりも小さいため、無視されます。

let chart = new Chart(ctx, {
    type: 'line',
    data: {
        datasets: [{
            label: '1つ目のデータセット',
            data: [0, 20, 40, 50]
        }],
        labels: ['1月', '2月', '3月', '4月']
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    suggestedMin: 50,
                    suggestedMax: 100
                }
            }]
        }
    }
});

suggested~の設定とは対照的に、minmaxの設定は明示的な端を軸に設定します。これらを設定すると、一部のデータ点が表示されないことがあります。

刻み幅

設定されている場合、スケール目盛はstepSizeの倍数で生成され、1つごとに目盛線が引かれます。設定されていない場合、目盛はnice numbersアルゴリズムを使用して自動的に付けられます。

この例では、 '0、0.5、1、1.5、2、2.5、3、3.5、4、4.5、5'に目盛線が引かれるy軸を持つチャートを設定します。

let options = {
    scales: {
        yAxes: [{
            ticks: {
                max: 5,
                min: 0,
                stepSize: 0.5
            }
        }]
    }
};

results matching ""

    No results matching ""