"CanvasJS 막대 그래프"의 두 판 사이의 차이

2020년 11월 2일 (월) 02:53 기준 최신판

CanvasJS tutorial, column chart, bar chart
CanvasJS 시작하기, 막대 그래프
CanvasJS 튜토리얼

1 예시[ | ]

예제: http://zetawiki.com/ex/js/CanvasJS/column.php

<div id="chartContainer" style="height: 300px; width: 100%;"></div>

<script src="//cdnjs.cloudflare.com/ajax/libs/canvasjs/1.4.1/canvas.min.js"></script>
<script>
window.onload = function () {
  var chart = new CanvasJS.Chart("chartContainer", {
	  theme: "theme2",//theme1
	  title:{
		  text: "CanvasJS 기본 막대 그래프"              
	 },
	  data: [              
	  {
		  type: "column",
		  dataPoints: [
		  { label: "사과", y: 10 },
		  { label: "오렌지", y: 15 },
		  { label: "바나나", y: 25 },
		  { label: "망고", y: 30 },
		  { label: "포도", y: 28 },
		  ]
	  }
	  ]
  });
  chart.render();
}
</script>

2 같이 보기[ | ]

3 참고[ | ]

http://canvasjs.com/

@@ 5번째 줄: / 5번째 줄: @@
 ==예시==
 *예제: http://zetawiki.com/ex/js/CanvasJS/column.php
-<source lang='html5'>
+<syntaxhighlight lang='html5'>
 <div id="chartContainer" style="height: 300px; width: 100%;"></div>
@@ 32번째 줄: / 32번째 줄: @@
 }
 </script>
-</source>
+</syntaxhighlight>
 ==같이 보기==