Google图表JSON结构-什么是不正确的

Question

感谢你对这件事的任何帮助。

我正在从服务器上提供JSON，但是数据没有显示在我的表上。没有javascript错误，这表明我的JSON存在问题(在JS函数中使用示例数据.)。

这是JSON；

    {
        "cols": [
            {"label": "month","type": "string"},
            {"label": "date","type": "date"},
            {"label": "amount","type": "number"},
            {"label": "extype","type": "string"},
            {"label": "claimed","type": "boolean"}
        ],
        "rows": [
            {"c":["2016-10","2016-10-01",{"v":38.09,"f":"$38.09"},"Dinner",true]},
            {"c":["2016-10","2016-10-02",{"v":30.07,"f":"$30.07"},"Lunch",true]},
            {"c":["2016-10","2016-10-03",{"v":44.7,"f":"$44.7"},"Dinner",true]}
        ]
    }

下面是用于呈现表的javascript函数。上面的JSON作为dataset传递给函数

    function drawTable(dataset,options){
        'use strict';
        var data = new google.visualization.DataTable(dataset);
        var cssClassNames = {
            'tableRow': '',
            'hoverTableRow': '',
            'headerCell': 'd',
            'tableCell': ''};
        options.cssClassNames = cssClassNames;
        var table = new google.visualization.Table(document.getElementById('tableChart'));
        table.draw(data, options);
    }

这是呈现的输出(只注意显示的数量)；

​

​

Answer 1

first，每个列都应该使用对象表示法来定义，类似于amount列

{"c":[{"v":"2016-10"},{"v":"Date(2016, 9, 1)"},{"v":38.09,"f":"$38.09"},{"v":"Dinner"},{"v":true}]}

下一步，为第二列的实际日期，格式需要更改.

从--> "2016-10-01"

to -> "Date(2016, 9, 1)"

注:使用此方法的月份为零(9 =10月)

看下面的工作片段..。

​

google.charts.load('current', {
  callback: function () {
    var jsonData = {
      "cols": [
        {"label": "month","type": "string"},
        {"label": "date","type": "date"},
        {"label": "amount","type": "number"},
        {"label": "extype","type": "string"},
        {"label": "claimed","type": "boolean"}
      ],
      "rows": [
        {"c":[{"v":"2016-10"},{"v":"Date(2016, 9, 1)"},{"v":38.09,"f":"$38.09"},{"v":"Dinner"},{"v":true}]},
        {"c":[{"v":"2016-10"},{"v":"Date(2016, 9, 2)"},{"v":30.07,"f":"$30.07"},{"v":"Lunch"},{"v":true}]},
        {"c":[{"v":"2016-10"},{"v":"Date(2016, 9, 3)"},{"v":44.7,"f":"$44.7"},{"v":"Dinner"},{"v":true}]}
      ]
    };

    var data = new google.visualization.DataTable(jsonData);
    var table = new google.visualization.Table(document.getElementById('tableChart'));
    table.draw(data);
  },
  packages:['table']
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="tableChart"></div>

​