Chart.js

Configuration

 

type: 'line'   data: {} options: {       plugins: {}     }}   plugins: [] }

Configuration object structure

type

Chart type은 차트의 기본 유형을 결정합니다.

Name	Description
bar	bar 차트는 데이터 값을 수직 막대로 표시하는 방법을 제공합니다. 추세 데이터와 여러 데이터 세트의 비교를 나란히 표시하는 데 사용되기도 합니다.
bubble	bubble 차트는 데이터의 3차원을 동시에 표시하는 데 사용됩니다. 버블의 위치는 처음 2차원과 해당 수평 및 수직 축에 의해 결정됩니다. 세 번째 차원은 개별 버블의 크기로 표시됩니다.
doughnut	데이터의 호는 각 데이터의 비례 값을 표시합니다.
line	line 차트는 데이터를 선에 표시하는 방법입니다
Mixed Chart Types	여러 차트를 혼합하여 사용하는 방법입니다.
polarArea	polarArea 는 원형 차트와 세그먼트의 반지름은 값에 따라 다릅니다. 이 유형의 차트는 파이 차트와 유사한 비교 데이터를 표시할 때 유용할 뿐만 아니라 컨텍스트 값의 척도도 표시할 수 있습니다.
radar	radar 차트는 여러 데이터 점과 데이터 점 사이의 변동을 표시하는 방법입니다. 두 개 이상의 서로 다른 데이터 집합의 점을 비교하는 데 유용한 경우가 많습니다.
scatter	scatter 차트는 데이터를 전역에 퍼트려 표시하는 방법입니다. 사용하려면 데이터가 X 및 Y 속성을 포함하는 객체로 전달되어야 합니다.

 

 

 

Data

-       Dataset Configuration

Name	Type	Description
label	string	범례 및 도구 설명에 나타나는 데이터 집합의 레이블입니다.
clip	number|object	차트 영역을 기준으로 클리핑하는 방법. 양수 값을 사용하면 차트 영역 내의 양, 음수 값 클립을 사용할 수 있습니다.
order	number	데이터 집합의 그리기 순서입니다. 적층 순서, 도구 설명 및 범례에도 영향을 미칩니다.
stack	string	데이터 집합이 속한 그룹의 ID입니다(쌓인 경우 각 그룹은 별도의 스택이 됩니다). 기본값은 데이터 집합 유형입니다.
parsing	boolean|object	데이터 집합을 구문 분석하는 방법입니다. 차트 옵션 또는 데이터 집합에서 false를 지정하여 구문 분석을 사용하지 않도록 설정할 수 있습니다. 구문 분석이 비활성화된 경우 데이터를 정렬하고 관련 차트 유형 및 척도가 내부적으로 사용하는 형식으로 사용해야 합니다.
hidden	boolean	데이터 세트의 가시성을 구성합니다. hidden: true를 사용하면 데이터 집합이 차트에서 렌더링되지 않습니다.

datasets: [

                        {

                            barPercentage: 0.5,

                            barThickness: 6,

                            maxBarThickness: 8,

                            minBarLength: 2,

                            data: [65, 59, 80, 81, 56, 55, 40],

                            backgroundColor: [

                                "rgba(255, 99, 132, 0.2)",

                                "rgba(255, 159, 64, 0.2)",

                                "rgba(255, 205, 86, 0.2)",

                                "rgba(75, 192, 192, 0.2)",

                                "rgba(54, 162, 235, 0.2)",

                                "rgba(153, 102, 255, 0.2)",

                                "rgba(201, 203, 207, 0.2)",

                            ],

                            borderColor: [

                                "rgb(255, 99, 132)",

                                "rgb(255, 159, 64)",

                                "rgb(255, 205, 86)",

                                "rgb(75, 192, 192)",

                                "rgb(54, 162, 235)",

                                "rgb(153, 102, 255)",

                                "rgb(201, 203, 207)",

                            ],

                            borderWidth: 1,

                        },

                    ],

                },

 

 

options

 

 

plugins

단일 차트에 플러그인을 추가하지 않고 글로벌 하게 등록하는 방법입니다

Axes

축은 차트의 필수적인 부분입니다. 데이터가 차트의 픽셀 값에 매핑되는 방법을 결정하는 데 사용됩니다. 데카르트 차트에는 점을 2차원 캔버스에 매핑하기 위한 X축과 Y축이 하나 이상 있습니다. 이러한 축을 '데카르트 축'이라고 합니다.
radar 차트 또는 polar area 차트 같은 방사형 차트에는 각도 및 방사형 방향으로 점을 매핑하는 단일 축이 있습니다. 이를 '방사형 축'이라고 합니다.