时间戳

首页 > 解决方案 > FLOT Charts 不绘制图表的问题

javascript - FLOT Charts 不绘制图表的问题

问题描述

var dataprofit = [];
var databalance = [];
var datastops = [];
var aline = [];
var profit = [];
var balance = [];
var stop = [];


var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var jresp=JSON.parse(this.responseText);
        for (i=0; i<jresp.length; i++) {
            aline = jresp[i]
            profit = [aline['ticket'], aline['profit']];
            balance = [aline['ticket'], aline['balance']];
            stop = [aline['ticket'], aline['stop']];
            dataprofit.push(profit);
            databalance.push(balance);
            datastops.push(stop);
         }

        // EquityCounter.update(jresp["equity"]);
    }
};
xhttp.open("GET", "https://dashboard.luxtradingfirm.com/getvalues/1234", true);
xhttp.send(null);

var optionsSeries = {
    yaxis: { min: 14000, max: 16000 },
    xaxis: { show: false },
    grid: {
        tickColor: '#dddddd',
        borderWidth: 0,
    },
    legend: {position: 'sw'},
    colors: ['#008000','rgba(65,139,202,0.5)', '#FF0000']
};
var dataset = [
    {
        label: "Succeed",
        data: dataprofit,
        series: { shadowSize: 0 },
        lines: { fill: false },
    } , {
        label: "Balance",
        data: databalance,
        series: { shadowSize: 1 },
        lines: { fill: true, fillColor: { colors: [{ opacity: 1 }, { opacity: 0.1 }] } },
    }, {
        label: "Fail",
        data: datastops,
    }
];


$.plot($('#realtimechart'), dataset, optionsSeries);

此代码从链接中读取一个 json 对象，然后将其放入 3 个不同的数组中，使用 Flot 图表的选项将 3 个数组重新组合为 1。但是，Flotchart 不会绘制。如果我将数组更改为手动编码数组（在数据集数组中），它会完美运行。怎么了？

标签： javascriptflot

解决方案

数组和绘图函数的组装必须在 xhttp.onreadystatechange = function() {} 内

否则它将组装空数组，因为 API 调用尚未完成。

推荐阅读