3

1.) 如何使用新的 Rickshaw.Graph.Ajax 访问数据?我的完整代码如下,包括通过 AJAX 调用的 JSON 示例集:

(function(){
    var ajaxGraph = new Rickshaw.Graph.Ajax( {
        element: document.getElementById("chart"),
        width: 400,
        height: 200,
        renderer: 'line',
        dataURL: '/data.json',
        onData: function(data) {
            var arrData = [];
            $.each(data[0], function(i, l){
                var rawData = l.data;
                arrData.push(rawData);
                return arrData;
            });

        }
    } );

})();

//JSON 样本

[{
    "took": 32,
    "total": 34200,
    "strokeVolume_count": {
        "name": "strokeVolume_count",
        "data": [
            {"x": 1387130400000,"y": 1800},
            {"x": 1387134000000,"y": 1800}
         ]
     }
}]

2.) 我应该如何知道何时使用 .render() 方法?我已经看到在某些图表上使用了这种示例,而在其他图表上则没有。我已经阅读了 Rickshaw/github 文档,解释说您可以使用它来绘制或重绘图形,但是,我已经看到其他示例显示不使用此方法。

4

1 回答 1

1

我不完全确定您的第一个问题是什么意思,但是您需要从 onData 函数返回一系列对象数组。

关于调用 graph.render(),我已经成功地将调用放在 onComplete 回调中,如下所示:

(function(){
    var ajaxGraph = new Rickshaw.Graph.Ajax( {
        element: document.getElementById("chart"),
        width: 400,
        height: 200,
        renderer: 'line',
        dataURL: '/data.json',
        onData: function(data) {
            return [{
                name : "Stroke Volume"
                data : data[0].strokeVolume_count.data;
            }];
            // or simply return [data[0].strokeVolume_count]; since it looks like a series object already
        },
        onComplete: function() {
            // this is also where you can set up your axes and hover detail
            this.graph.render();
        }
    } );

})();
于 2014-01-07T17:28:02.103 回答