1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart1); google.charts.setOnLoadCallback(drawChart2); function drawChart1() { // Create the data table. var data1 = new google.visualization.DataTable(); data1.addColumn('string', 'Topping'); data1.addColumn('number', 'Slices'); data1.addRows([ ['남성', 3], ['여성', 1], ]); // Set chart options var options1 = {'title':'성별 예매 분포', 'width':400, 'height':300}; // Instantiate and draw our chart, passing in some options. var chart1 = new google.visualization.PieChart(document.getElementById('chart_div1')); chart1.draw(data1, options1); } function drawChart2() { // Create the data table. var data2 = new google.visualization.DataTable(); data2.addColumn('string', 'Topping'); data2.addColumn('number', 'Slices'); data2.addRows([ ['10대', 3], ['20대', 1], ['30대', 1], ['40대', 1], ['50대이상', 1], ]); // Set chart options var options2 = {'title':'연령별 예매 분포', 'width':400, 'height':300, 'pieHole': 0.4,}; // Instantiate and draw our chart, passing in some options. var chart2 = new google.visualization.PieChart(document.getElementById('chart_div2')); chart2.draw(data2, options2); } </script> | cs |
콜백 추가시에
google.charts.setOnLoadCallback(drawChart1);
google.charts.setOnLoadCallback(drawChart2);
data1 options1 chart1
data options chart 부분에서 숫자를넣어 구분지어준다
'Etc' 카테고리의 다른 글
| git / sourcetree commit & push 사용법 (0) | 2017.02.26 |
|---|---|
| gitignore.io (0) | 2017.02.26 |
