데이터 통계 및 분석 사업에서 고객이 막대 차트, 파이 차트, 곡선 차트를 하나의 차트에 표시해야 하는 경우가 있습니다. 즉, 막대 차트에서 특정 데이터를 볼 수 있습니다. 막대 차트에서 변화하는 추세를 곡선 차트에서 볼 수 있으며, 데이터의 각 부분에 대한 비율을 파이 차트에서도 볼 수 있습니다. Highcharts는 세 장의 사진을 하나로 합치는 효과를 쉽게 얻을 수 있습니다.
var 차트;
$(문서).ready(함수() {
차트 = 새로운 Highcharts.Chart({
차트: {
renderTo: '컨테이너',
defaultSeriesType: '지역'
},
제목: {
텍스트: '지역별 과거 및 추정 세계 인구 증가율'
},
자막: {
텍스트: '출처: Wikipedia.org'
},
x축: {
카테고리: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'],
TickmarkPlacement: 'on',
제목: {
활성화됨: 거짓
}
},
y축: {
제목: {
텍스트: '수십억'
},
라벨: {
포맷터: function() {
return this.value / 1000;
}
}
},
툴팁: {
포맷터: function() {
'' 반환
this.x ': ' Highcharts.numberFormat(this.y, 0, ',') ' 수백만';
}
},
플롯 옵션: {
지역: {
스태킹: '보통',
lineColor: '#666666',
선폭: 1,
마커: {
선폭: 1,
라인 색상: '#666666'
}
}
},
시리즈: [{
이름: '아시아',
데이터: [502, 635, 809, 947, 1402, 3634, 5268]
}, {
이름: '아프리카',
데이터: [106, 107, 111, 133, 221, 767, 1766]
}, {
이름: '유럽',
데이터: [163, 203, 276, 408, 547, 729, 628]
}, {
이름: '아메리카',
데이터: [18, 31, 54, 156, 339, 818, 1201]
}, {
이름: '오세아니아',
데이터: [2, 2, 2, 6, 13, 30, 46]
}]
});
});
위 내용은 이 글에 설명된 내용의 전부입니다. jQuery를 사용하여 히스토그램과 파이 차트를 그리는 모든 분들께 도움이 되기를 바랍니다