An Example of a Google Bar Chart
HTML
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="chart_div" style="width: 80%; height: 400px;"></div>
JavaScript
// Visualization API と折れ線グラフ用のパッケージのロード
google.load("visualization", "1", {
packages: ["corechart"]
});
// Google Visualization API ロード時のコールバック関数の設定
google.setOnLoadCallback(drawChart);
// グラフ作成用のコールバック関数
function drawChart() {
// データテーブルの作成
var data = google.visualization.arrayToDataTable([
["", "データ1", "データ2", "データ3", "データ4"],
["2015/11/25", 100, 350, 150, 150],
["2015/11/26", 200, 450, 250, 500],
["2015/11/27", 300, 100, 400, 150],
["2015/11/28", 150, 200, 100, 350],
["2015/11/29", 250, 300, 200, 450],
["2015/11/30", 400, 150, 300, 100],
]);
// グラフのオプションを設定
var options = {
title: 'マルチラインチャートサンプル',
};
// LineChart のオブジェクトの作成
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
// データテーブルとオプションを渡して、グラフを描画
chart.draw(data, options);
}