![]() |
Photo by Markus Winkler on Unsplash |
chart.js를 이용해서 라인 차트를 그릴 때, 일부 데이터가 없다면 어떻게 보일까? 라인 차트는 점과 점을 선으로 이은 것이다. 만약 연속된 데이터가 아니라면, 점과 점을 잇는 선이 생략된다. 결국 아래 이미지에서 보이는 것과 같은 라인 차트가 생성된다.
위의 경우는 기본 옵션인 경우이다. 점과 점 사이의 단절을 무시하고, 다음번에 나타나는 점까지 가상의 선을 그릴 수 있는 옵션을 선택할 수 있다. spanGaps 항목을 true로 지정하면 된다. 그러면 아래 그림처럼 가상의 선이 그려진 라인 차트를 확인할 수 있다.
참고: spanGaps
• spanGaps: number | boolean
If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used.
default false