**文書の過去の版を表示しています。**
Google Chart API を使って円グラフを作成
https://developers-dot-devsite-v2-prod.appspot.com/chart/interactive/docs/gallery/piechart.html
<script src=“https://www.gstatic.com/charts/loader.js”></script>
でGoogle Chart APIを読み込む- ブラウザ上でグラフを書く関数を作成(以下は関数の中身)
google.charts.load('current', {packages: ['corechart']});
:パッケージをロードするgoogle.charts.setOnLoadCallback(drawChart);
:コールバック関数の登録- コールバック関数を実装する
var data = new google.visualization.arrayToDataTable([])
の引数にリストでHeaderや値を入れていく- オプションはオブジェクトで作成
var chart = new google.visualization.PieChart(document.getElementById('target'));
:描画用インスタンスの生成chart.draw(data, options);
:描画メソッドの呼び出し
100%積み上げ横棒グラフの作成
https://www.finddevguides.com/Googlecharts-bar-percent
- 描画用インスタンスを作成する時に、BarChartを使用する
- 通常の棒グラフと列と行を反転させることで積み上げグラフになる。
- オプションで
isStacked: 'percent'
を使用することで100%グラフになる。
汎用の削除
- オプションで
legend: 'none'
を指定