省略数据时,不会显示Google堆积条形图

时间:2015-01-18 19:00:41

标签: javascript charts google-visualization

我正在尝试在我的项目中实施谷歌图表。

我想在条形图上显示最后x次测试的标记。

但问题是,用户可以为测试选择任意数量的科目,例如数学和历史。所以我只想在条形图中显示这些科目。

我无法显示0,因为“0”可能会推断用户在该主题中得到0分。我只想包括用户提供测试的主题。

这可能在谷歌图表或任何其他图书馆?

以下是代码:

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi">        </script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
        ['Math', 'Science', 'History', 'Geography', { role:     'annotation' } ],
        ['#1', 10, 24, 20,  ''],
        ['#2', 16, 22, 23,  ''],
        ['#3', 28, 19, 29,  '']
      ]);

      var options = {
        width: 600,
        height: 400,
        legend: { position: 'top', maxLines: 3 },
        bar: { groupWidth: '75%' },
        isStacked: true
      };

        var chart = new     google.visualization.BarChart(document.getElementById('chart_div'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

我尝试了morris.js,但我没有成功。

任何帮助将不胜感激。谢谢!

0 个答案:

没有答案