javascript
2d 차트 그리기 (with javascript)
다양성
2021. 7. 25. 16:53
2D 차트를 javascript를 이용하여 그려보자.
HTML , js 파일에 다음 내용을 기재하면 맨 아래 결과물을 얻을수 있다.
<HTML 파일 내용 >
<div id='chart-container'>
<canvas id="myChart"></canvas>
</div>
<javascript 내용>
var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
//차트설정
type: 'line',
//차트데이터
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [{
label: '주간 판매량',
backgroundColor: 'rgb(255, 99, 132)',
borderColor: 'rgb(255, 99, 132)',
data: [5, 10, 5, 2, 20, 30, 45]
}]
},
options: {}
});
최종결과물)
