GoogleChart

Last-modified: 2014-11-25 (火) 14:49:11

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);

function drawChart() {

 var data = google.visualization.arrayToDataTable([
       ['Genre', 'Fantasy & Sci Fi', 'Romance', 'Mystery/Crime', 'General',
        'Western', 'Literature', { role: 'annotation' } ],
       ['2010', 10, 24, 20, 32, 18, 5, ''],
       ['2020', 16, 22, 23, 30, 16, 9, ''],
       ['2030', 28, 19, 29, 30, 12, 13, ''],
     ]);
     var options = {
       width: 600,
       height: 400,
       legend: { position: 'top', maxLines: 3 },
	    bar: { groupWidth: '75%' },
       isStacked: true,
     };
  var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
 chart.draw(data, options);

}

</script>

div id="chart_div" style="width: 820px; height: 200px;"></div>