Question

我正在尝试使用来自RESTful Web服务的一些数据来填充折线图（CanvasJS）。

来自我的JSON数组看起来像：

[
[
    {
        "periodo": "2014-03-03",
        "quantidade": 2
    },
    {
        "periodo": "2014-09-13",
        "quantidade": 1
    },
    {
        "periodo": "2015-06-23",
        "quantidade": 6
    },
    {
        "periodo": "2015-06-24",
        "quantidade": 2
    },
    {
        "periodo": "2015-06-25",
        "quantidade": 1
    }
],
[
    {
        "periodo": "2015-06-23",
        "quantidade": 1
    }
]
]

即两个数组（我希望在图中的两行中进行转换）。在我的jQuery代码中，我正在为这个JSON数组添加一些特性，如下所示：

var chartdata = [];

jQuery.each(data, function(i, val) {     
   var chart = {};
   chart["type"] =          "spline";
   chart["showInLegend"] =  true;
   chart["dataPoints"] =    val;
   chartdata.push(chart);
});

最后我打电话给抽屉：

var chart = new CanvasJS.Chart("chartContainer",{
            animationEnabled: true,
            zoomEnabled: true,
            data: chartdata,
            legend: {
                cursor: "pointer",
                itemclick: function (e) {
                    if (typeof(e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                        e.dataSeries.visible = false;
                    } else {
                        e.dataSeries.visible = true;
                }
                chart.render();
                }
            }
        });

但是图表没有被绘制出来。也没有错误。我比较了我的最终JSON数组，它与CanvasJS example

中的数组很相似

我在哪里错过了？

Answer 1

看起来你的chart.render（）只在图例对象中。在创建图表对象后尝试放置它（见下文）。

我希望这会有所帮助。垫

var chart = new CanvasJS.Chart("chartContainer",{
    animationEnabled: true,
    zoomEnabled: true,
    data: chartdata,
    legend: {
        cursor: "pointer",
        itemclick: function (e) {
            if (typeof(e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                e.dataSeries.visible = false;
            } else {
                e.dataSeries.visible = true;
            }
            chart.render();
        }
    }
});
chart.render();

CanvasJS图表尚未填充

1 个答案: