Question

这是一个新手问题，但如何在Google Charts line chart中使用x轴的日期？

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

      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的数据列不能是字符串”）

Answer 1

如何将日期转换为字符串，只需使用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); }

我希望这会有所帮助。

Answer 2

那是因为你正在使用arrayToDataTable（）。如果您使用DataTable（），则错误消息将消失。请参阅此帖子：Column Chart with date axis not working

Google Charts折线图中的a轴上的日期

2 个答案: