4

这是一个新手问题，但是如何在Google Charts 折线图中使用日期作为 x 轴？

当我使用 new Date( ... ) 时，我收到错误消息“未捕获的错误：不支持日期和日期时间列类型”

      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
['Datum','Person1','Person2','Person3'],
[new Date(2012, 12, 19, 0, 0, 0),'5072.0537223002','5072.0537223002','5074.2809630567'],
[new Date(2012, 12, 20, 0, 0, 0),'5072.0537223002','5072.0537223002','5074.2809630567'],
]);

        var options = {};

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

（在 x 轴上使用字符串均匀空格是可以接受的，但是当我尝试使用字符串“轴 #0 的数据列不能是字符串类型”时）

4

2 回答 2

8

将日期转换为字符串并仅使用Date而不使用new如下所示：

      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
['Datum','Person1','Person2','Person3'],
[Date(2012, 12, 19, 0, 0, 0).toString(),'5072.0537223002','5072.0537223002','5074.2809630567'],
[Date(2012, 12, 20, 0, 0, 0).toString(),'5072.0537223002','5072.0537223002','5074.2809630567'],
]);

        var options = {};

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

编辑： 您可以在此链接中按照他们的示例进行操作：

https://google-developers.appspot.com/chart/interactive/docs/customizing_axes

编辑2：

这就是我能够做到的：http: //jsfiddle.net/ANC9H/2/

    google.load("visualization", "1", {packages:["LineChart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
    var data = new google.visualization.DataTable();
        data.addColumn('date', 'Date');
        data.addColumn('number', 'persone1');
        data.addColumn('number', 'persone2');
        data.addColumn('number', 'persone3');
        data.addRows([
                       [new Date(2008, 1 ,1),0.7,0.8,0.6],
                       [new Date(2008, 1 ,7),0.5,0.55,0.9] ]);
    var options = {};

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

我希望这有帮助。

于 2012-12-20T00:43:14.890 回答
0

那是因为您使用的是 arrayToDataTable()。如果您使用 DataTable() 错误消息将消失。请参阅此帖子：带有日期轴的柱形图不起作用

于 2013-08-20T20:37:46.767 回答