극좌표형

극좌표 차트는 파이 차트와 비숫하지만 각 세그먼트가 같은 각도를 가지고 있습니다 - 값에 따라 세그먼트의 반지름이 다릅니다.

차트의 이 유형은 파이 차트와 비슷하게 비교를 보여주고 싶을 때 유용할 뿐만 아니라 맥락에 대한 값의 규모를 보여주기에도 좋습니다.

사용 예시

new Chart(ctx, {
    data: data,
    type: 'polarArea',
    options: options
});

데이터집합 속성들

다음의 옵션들은 특정 데이터집합에 대한 극좌표 차트 데이터 집합의 설정 옵션을 포함합니다.

스타일링

각 호의 스타일은 다음의 속성들로 제어할 수 있습니다:

만약 이 모든 값이 undefined라면, 관련 elements.arc.* 옵션으로 대체됩니다.

테두리 정렬

다음의 값들은 borderAlign을 지원합니다.

• 'center' (default)
• 'inner'

'center'로 설정하면, 각 다음 호의 테두리들은 겹치게됩니다. 'inner'로 설정하면, 모든 테두리들은 겹치지 않습니다.

상호작용

각 호에 대한 상호작용은 다음의 속성들로 제어할 수 있습니다:

만약 이 모든 값들이 undefined라면, 관련 elements.arc.* 옵션으로 대체됩니다.

설졍 옵션

극좌표 차트에 관련된 사용자 지정 옵션입니다. 이 옵션들은 전역 차트 기본 옵션과 합쳐져 차트의 옵션을 형성합니다.

기본 옵션

또한 각 극좌표 유형이 생성될 때 기본 값들을 변경할 수 있으며, 이 객체는 Chart.defaults.polarArea에서 이용가능합니다. 전역 옵션의 변경은 변경된 이후에 생성된 차트에게만 영향을 미칩니다. 이미 존재하던 차트들은 변경되지 않습니다.

예를 들어, 모든 새로운 극좌표 차트에 animateScale = false 를 하고 싶다면 이렇게 할 수 있습니다:

Chart.defaults.polarArea.animation.animateScale = false;

데이터 구조

극좌표 차트에서, 데이터 지점들의 배열을 담은 데이터집합이 필요합니다. 데이터 지점은 반드시 숫자여야 하며, Chart.js는 모듣 숫자들을 총합과 각 관련 비율을 계산합니다.

또한 각 조각을 툴팁에 정확히 표현하도록 하기 위해 특정 라벨의 배열이 필요합니다.

data = {
    datasets: [{
        data: [10, 20, 30]
    }],

    // 이 라벨들은 다른 호를 호버하면 범례와 툴팁에 나타납니다
    labels: [
        'Red',
        'Yellow',
        'Blue'
    ]
};