Question

我有以下函数读取JSON数据并将其放在图表上。我想每隔10秒自动更新一次图表数据。

我已经看过dojo / timing和chart.updateSeries，我相信两者的组合可以解决问题，但我不确定如何实现这一点。任何帮助将不胜感激。

function(xhr, json, arrayUtil, number, Chart, theme) {

            var def = xhr.get({
                url: "cpuusage.json",
                handleAs: "json"
            });

            def.then(function(res){
                var chartData = [];                 
                arrayUtil.forEach(res.chart, function(chart){
                    chartData[chart.x] = number.parse(chart.y);
                });

                //Draw chart
                var chart = new Chart("chartNode2");
                chart.setTheme(theme);
                chart.addPlot("default", {
                    type: "Columns",
                    markers: true,
                    gap: 5
                });
                chart.addAxis("x");
                chart.addAxis("y", { vertical: true, fixLower: "major", fixUpper: "major" });
                chart.addSeries("Monthly Sales",chartData);
                chart.render();

            }, function(err){
                console.error("Failed to load JSON data");
            });
        }

Answer 1

尝试类似的东西：

var interval = setInterval(function(){
    // let's get new data
    xhr.get({
        url: "cpuusage.json",
        handleAs: "json"
    }).then(function(res){
        // data prep step - just like before
        var chartData = [];
        arrayUtil.forEach(res.chart, function(chart){
            chartData[chart.x] = number.parse(chart.y);
        });
        // update chart (it was created before)
        chart.updateSeries("Monthly Sales", chartData);
        chart.render();
    }, function(err){
        console.error("Failed to load updated JSON data");
    });
}, 10000); // 10s
...
// when we want to cancel updates
clearInterval(interval);

抱歉，我没有使用dojo/timing，我在这里没有太多理由，并且更喜欢简单的方法来做简单的事情。

在Dojo中更新图表数据

1 个答案: