Google Charts API - 为折线图分组表格

时间:2012-09-14 18:49:47

标签: javascript google-visualization

我目前有一个如下所示的表,我正在试图弄清楚如何创建一个线图,其中x轴是'Date',y轴是''API调用'和有三行,一行用于'类别'中的每个唯一值。我一直在浏览Google Charts API文档,但似乎无法找到合适的功能组合来实现这一功能。任何帮助表示赞赏。

A DataTable

1 个答案:

答案 0 :(得分:0)

您需要以这种格式将数据排列在数组中:

[  [“日期”,“产品”,“食谱”,“两者”],  [“2012年1月1日”,176,0,144],  [“2012年7月1日”,16,0,82],  ... ]

例如:

<script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
         ["date", "product", "recipe", "both"],
         ["Jan 1, 2012", 176, 0, 144],
         ["Jul 1, 2012", 16, 0, 82],
         ["Aug 1, 2012", 41, 81, 82],
         ["Sep 1, 2012", 27, 7, 7],
         ["Oct 1, 2012", 9, 0, 0]
        ]);

        var options = {
          title: 'Your data'
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>

此处正在使用jsfiddle