javascript - dygraphs 标签数量与数组中的列数不匹配

Question

无法使图文正常工作。

我有一个由 PHP 填充的数组，如下所示:

data = [
{
    "DATA": "2016-01-22",
    "TOTAL": [
        "7",
        "4",
        "20",
        "0"
    ]
},
{
    "DATA": "2016-01-25",
    "TOTAL": [
        "3",
        "2",
        "10",
        "0"
    ]
},
{
    "DATA": "2016-01-26",
    "TOTAL": [
        "1",
        "1",
        "4",
        "0"
    ]
},
{
    "DATA": "2016-01-27",
    "TOTAL": [
        "2",
        "1",
        "2",
        "0"
    ]
},
{
    "DATA": "2016-02-02",
    "TOTAL": [
        "1",
        "1",
        "1",
        "0"
    ]
},
{
    "DATA": "2016-02-10",
    "TOTAL": [
        "1",
        "1",
        "3",
        "0"
    ]
}
]

然后我将图表的数据构建为:

data.forEach(function(item) {
    var adata = item.DATA;
    var atotal = item.TOTAL;

    graphstr1 += '[new Date("' + adata + '"),' + atotal + '],';
});
graphstr1 = graphstr1.slice(0, -1);
console.log(graphstr1);

查看控制台，数据是所需的格式，但我总是在问题标题中收到错误

Dygraph代码:

g = new Dygraph(
    document.getElementById("graphdiv"), [
        graphstr1,
        /*[new Date("2016-01-22"), 7, 4, 20, 0],
        [new Date("2016-01-25"), 3, 2, 10, 0],
        [new Date("2016-01-26"), 1, 1, 4, 0],
        [new Date("2016-01-27"), 2, 1, 2, 0],
        [new Date("2016-02-02"), 1, 1, 1, 0],
        [new Date("2016-02-10"), 1, 1, 3, 0]*/

    ], {
        labels: ["x", "Registados", "Grávidas", "Com Filhos", "Sem Filhos"]
    }
);

Answer 1

为什么不直接使用数组而不自制字符串化版本？

var data = [{ DATA: "2016-01-22", TOTAL: ["7", "4", "20", "0"] }, { DATA: "2016-01-25", TOTAL: ["3", "2", "10", "0"] }, { DATA: "2016-01-26", TOTAL: ["1", "1", "4", "0"] }, { DATA: "2016-01-27", TOTAL: ["2", "1", "2", "0"] }, { DATA: "2016-02-02", TOTAL: ["1", "1", "1", "0"] }, { DATA: "2016-02-10", TOTAL: ["1", "1", "3", "0"] }],
    converted = data.map(function (a) {
        return [new Date(a.DATA)].concat(a.TOTAL.map(Number));
    }),
    g = new Dygraph(
        document.getElementById("graphdiv"),
        converted, 
        { labels: ["x", "Registados", "Grávidas", "Com Filhos", "Sem Filhos"] });

<div id="graphdiv"></div>
<script type="text/javascript"
  src="https://cdnjs.cloudflare.com/ajax/libs/dygraph/1.1.1/dygraph-combined-dev.js"></script>