web-dev-qa-db-ja.com

Googleチャートツール-積み上げ棒グラフを作成する方法

重複の可能性：
誰かがグーグルチャートを使用して単純な垂直棒グラフを作成するのを手伝ってくれませんか？

新しいGoogleグラフツールを使用していますが、積み上げ棒グラフ形式を作成したいと思います。

charts
12
Andrew Khaw

Google Developersサイトには、棒グラフの形式に関する詳細が記載されています。 https://developers.google.com/chart/interactive/docs/gallery/barchart

通常の棒グラフを積み重ねるには、isStacked: trueオプションを使用する必要があります。次のコードをコピーしてChartToolsプレイグラウンドに貼り付けると、実際の例を確認できます。 http://code.google.com/apis/ajax/playground/?type=visualization

function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['Year', 'Austria', 'Bulgaria', 'Denmark', 'Greece'],
    ['2003',  1336060,    400361,    1001582,   997974],
    ['2004',  1538156,    366849,    1119450,   941795],
    ['2005',  1576579,    440514,    993360,    930593],
    ['2006',  1600652,    434552,    1004163,   897127],
    ['2007',  1968113,    393032,    979198,    1080887],
    ['2008',  1901067,    517206,    916965,    1056036]
  ]);

  // Create and draw the visualization.
  new google.visualization.BarChart(document.getElementById('visualization')).
      draw(data,
           {title:"Yearly Coffee Consumption by Country",
            width:600, height:400,
            vAxis: {title: "Year"},
            hAxis: {title: "Cups"},
            isStacked: true}
      );
}

表示しようとしているデータによっては、積み上げ面グラフにも関心がある場合があります。

Chart Tools Image APIを使用した積み上げ棒グラフの例を示す質問もあります： Javascriptの棒グラフ：積み上げ棒+グループ化された棒

Google Chart Toolsの画像チャート部分は2012年4月20日に正式に非推奨になりました。画像チャートは、Googleの非推奨ポリシーに従ってしばらくは機能しますが、上記のインタラクティブなHTML5 + SVGの実装に集中することをお勧めします。

28
Daniel