谷歌图表工具 - 如何创建堆积条形图[复制](Google Chart Tools - How to

2019-07-29 06:46发布

可能重复:
有人可以帮助我建立使用谷歌图表简单垂直条形图?

即时通讯使用新谷歌图表工具,我想创建堆叠条形图格式。

Answer 1:

该谷歌开发者网站上提供了有关条形图格式的一些细节: https://developers.google.com/chart/interactive/docs/gallery/barchart

为了使堆叠正常条形图,则需要用户isStacked: true选项。 您可以复制并粘贴以下代码到图表工具操场上看到一个工作示例: 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}
      );
}

您可能也有兴趣在一个堆积面积图,这取决于您要显示的数据。

还有一个问题使用图表工具图像API其给出堆积条形图的一个示例: 在Javascript条形图:堆叠条形+分组条

需要注意的是谷歌图表工具的图片图表部分在4月20日正式停用,2012年图片图表仍将一会儿按照谷歌的汰换政策工作,但我建议你专注于上述互动HTML5 + SVG实现。



文章来源: Google Chart Tools - How to create stacked bar chart [duplicate]
标签: charts