Question

我正在尝试创建一个实时更新的Highcharts图表以监视参数，我还想用来自MySQL服务器的数据回填该图表。

目前，我有在chart.events.load中调用的函数，（希望最终）将一系列包含SQL数据的图表添加到图表中。

function _initSeries(chart) {
    chart.addSeries({
        name: 'series1',
        data: (function() {
            // backfill data from MySQL
            let sqlData = [];

            _getMySqlData(function(result) {
                for (let i = 0; i < result.length; i += 1) {
                    sqlData.push({
                        x: result[i].milliseconds,
                        y: result[i].value
                    });
                }

                // preferrably I would return sqlData here but obviously that won't work
            });
            // return must be on this level
        }())
    });
}

从MySQL数据库检索数据的功能可以正常工作，并返回要推入sqlData并返回的值的数组。显然，我无法返回，因为我位于回调中，但是我不确定如何从回调中设置data的值。

Answer 1

我通过重组代码来解决这个问题；我没有立即致电chart.addSeries()，而是致电getMySqlData()。在该回调中，我可以使用getMySqlData()中chart.addSeries()的结果。

function _initSeries(key, chart) {
    _getMySqlData(key, function(result) {
        let sqlData = [];
        for (let i = 0; i < result.length; i += 1) {
            sqlData.push({
                x: result[i].milliseconds,
                y: result[i].value
            });
        }
        chart.addSeries({
            name: key,
            data: sqlData
        });
    });
}

使用来自Ajax调用的数据回填Highcharts图表

1 个答案: