Google Chartで作成したチャートを画像(PNG)として表示することができます。画像を表示するときに使うのが、getImageURIメソッドです。
下のコードでは、通常のチャート表示の他にボタンをクリックするとチャート画像(PNG)が表示されます。
google.load('visualization', '1', {packages:['corechart']}); google.setOnLoadCallback(drawChart); var chart; $(function() { $('#buttonImg').click(function() { $('#chartPNG').html('<img src="' + chart.getImageURI() + '">'); }); }); function drawChart() { var data = google.visualization.arrayToDataTable([ ['都道府県','人口'], ['東京', 13159388], ['大阪', 8865245], ['神奈川', 9048331], ['愛知', 7410719], ['福岡', 5071968], ['北海道', 5506419] ]); var options = { width: 500 }; chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); }
<div id="piechart"></div> <div id="chartPNG"></div> <input type="button" id="buttonImg" value="画像作成" />
スポンサーリンク
コメント