カテゴリ(category)

グローバル設定を使用している場合、 ラベルは、チャートデータに含まれるラベル配列のうちの一つが表示されます。 data.labelsのみが定義されている場合、data.labelsを使用します。 data.xLabelsが定義されており、軸が水平軸の場合、data.xLabelsを使用します。 同様に、data.yLabelsが定義されており、軸が垂直軸の場合、data.yLabelsを使用します。 data.xLabelsとdata.yLabelsの両方を定義した場合は、 X軸、Y軸の両方の文字列を使ってチャートを生成します。

上記をいずれかを指定した場合、(typeを定義していないならば)X軸はtype: categoryとして定義されます。 カテゴリラベルをより細かく設定するために、カテゴリ軸の定義としてlabelを追加することも可能です。 そうすることで、グローバルなデフォルト値を無視することができます。

カテゴリ軸の定義

グローバル

let chart = new Chart(ctx, {
    type: ...
    data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June'],
        datasets: ...
    },
});

軸定義の一部として

let chart = new Chart(ctx, {
    type: ...
    data: ...
    options: {
        scales: {
            xAxes: [{
                type: 'category',
                labels: ['January', 'February', 'March', 'April', 'May', 'June'],
            }]
        }
    }
});

目盛り線設定

カテゴリスケールには、目盛り線の設定のための以下のオプションがあります。 これらはtickオプションのサブオプションです。 これらのオプションは目盛線設定を拡張します。

最小/最大表示数

minプロパティとmaxプロパティは、 labels配列内に入れる必要があります。 以下の例では、"March"から"June"までが表示されます。

let chart = new Chart(ctx, {
    type: 'line',
    data: {
        datasets: [{
            data: [10, 20, 30, 40, 50, 60]
        }],
        labels: ['January', 'February', 'March', 'April', 'May', 'June'],
    },
    options: {
        scales: {
            xAxes: [{
                ticks: {
                    min: 'March'
                }
            }]
        }
    }
});