来自 REST 服务的数据的 cal-HeatMap 问题

Question

我正在研究 cal-HeatMap，并得到了一些静态 json-数据运行的例子。现在我想使用 REST 服务动态加载 json-data。不幸的是，当我使用来自 REST 服务的数据时，这并没有按预期工作。

这是 cal-HeatMap 的代码（RESTful 版本不起作用）：

var heatData = dojo.xhr.get({
    url:"http://localhost:8080/webapp/xfull2.nsf/services.xsp/heatdata",
    handleAs:"json"
});

var cal = new CalHeatMap();
cal.init(
{
    itemSelector:"#cal-heatmap",
    range: 10,
    start: new Date(2016, 3,4,1),
    data: heatData
}
);

REST 调用似乎启动并且 returns JSON 结果：

{
    "1459742400":1,
    "1459749600":1,
    "1459753200":1,
    "1459756800":1,
    "1459767600":1
}

在浏览器控制台上我看到这个错误：类型错误：a 未定义 cal-hea....min.js（第 8 行，第 30282 列）（在 cal-heamap 中。min.js）

我将 REST 调用中的 JSON 保存为 .json 文件，并使用该文件测试了 cal-HeatMap。在这种情况下，它可以正常工作。这是我的代码的静态版本：

var cal = new CalHeatMap();
cal.init(
{
    itemSelector:"#cal-heatmap",
    range: 10,
    start: new Date(2016, 3,4,1),
    data: "js/cal-heatmap/sample-json/testdata.json"
}
);

testdata.json 文件如下所示（同上）：

{
    "1459742400":1,
    "1459749600":1,
    "1459753200":1,
    "1459756800":1,
    "1459767600":1
}

结果如下所示（没问题）：

我在这里错过了什么？任何帮助或提示表示赞赏。

Answer 1

好吧，我终于找到了我的代码的问题 - 问题的答案很明显。当我使用带有 xhr.get 的异步 REST 调用时，我必须在回调中创建 HeatMap 对象。否则在创建 HeatMap 对象时数据尚不可用。

正确的代码如下所示：

var heatData = dojo.xhr.get({
    url:"http://localhost:8080/webapp/xfull2.nsf/services.xsp/heatdata",
    handleAs:"json",
    load: function(data) {
        var cal = new CalHeatMap();
        cal.init({
                itemSelector:"#cal-heatmap",
                range: 10,
                start: new Date(2016, 3,4,1),
                data: data
                });
    }
})

来自 REST 服务的数据的 cal-HeatMap 问题

cal-HeatMap issue with data from REST service

javascript

rest

json

cal-heatmap