범주 직교 축

만약 전역 설정을 사용한다면, 라벨은 차트 데이터에 포함된 라벨 배열 중 하나로 그려집니다. 만약 data.labels 만 정의되어 있다면, 이것이 사용됩니다. 만약 data.xLabels 정의되어 있고 가로축이라면 이것이 사용됩니다. 비슷하게 data.yLabels 정의되어 있고 세로축이라면 이 속성이 사용됩니다. xLabelsyLabels 두개를 함께 사용하면 X 와 Y 모두에 문자열을 사용한 차트를 생성할 수 있습니다.

위의 설정 중 하나를 지정하면 x 축이 유형으로 정의되며 달리 정의되지 않은 경우 type: 'category' 로 정의됩니다. 범주 라벨 보다 더 세밀하게 제어하기 위해 범주 축 정의의 일부로 labels 을 추가할 수도 있습니다. 이렇게 하면 전역 기본 값이 적용되지 않습니다.

범주 축 정의

전역으로:

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']
            }]
        }
    }
});

눈금 설정 옵션

범주 스케일은 눈금 마크를 설정하기 위해 다음의 옵션들을 제공합니다. 내부적으로 ticks 서브 객체 안에 있습니다. 이 옵션은 공통 눈금 설정을 확장합니다.

이름 유형 기본 값 설명
labels string[] - 표시할 라벨 배열.
min string 표시할 최소 항목. 더보기...
max string 표시할 최대 항목. 더보기...

최소 최대 설정

minmax 속성의 경우 값은 labels 배열에 있어야만 합니다. 아래 예시에서, x 축은 "3월" 부터 "6월"까지만 표시됩니다.

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'
                }
            }]
        }
    }
});

results matching ""

    No results matching ""