Highcharts图表连续显示0值：Javascript数组

Question

[我正在尝试使用PHP Mysql在图形上显示点，我将数据保存到php Variable中的数组中，然后将该数组传递给Javascript数组。

现在，我想做的是每秒显示一个数组元素。但是发生的是该图在Highchart上连续绘制了0值。

这是我的代码：

numArray = [1,5,3,5,6,3,3,7,4,6,7,3,5,3,6,7,5,2,5,7,4,6,4,5,3,6,7,8,5,4,3,6,7,8,5,7,8,8,5,3,2,4,6,7,4,6,7] ;
/* Just for understanding */

var json_array =numArray ;

var i = 0;

function next() {  
 return json_array[i];
  i++;
}
        Highcharts.chart('container', {
    chart: {
        type: 'line',
        animation: Highcharts.svg, // don't animate in old IE
        marginRight: 10,
        events: {
            load: function() {

                // set up the updating of the chart each second
                var series = this.series[0],
                    chart = this;

                setInterval(function() {
                    var x = (new Date()).getTime(), // current time
                        y =next();
                        console.log(y) ;
                    series.addPoint([x, y], false, true);
                }, 1000);

                setInterval(function() {
                    chart.redraw(false);
                }, 1000);
            }
        }
    },

    time: {
        useUTC: false
    },

    title: {
        text: 'Live random data'
    },
    xAxis: {
        type: 'datetime',
        tickPixelInterval: 150
    },
    yAxis: {
        title: {
            text: 'Value'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        headerFormat: '<b>{series.name}</b><br/>',
        pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'
    },
    legend: {
        enabled: false
    },
    exporting: {
        enabled: false
    },
    series: [{
        animation: false,
        name: 'Random data',
        data: (function() {
            // generate an array of random data
            var data = [],
                time = (new Date()).getTime(),
                i;

            for (i = -1000; i <= 0; i += 1) {
                data.push([
                    time + i * 10,
                    null
                ]);
            }
            return data;
        }())
    }]
});

这是我创建的小提琴：

https://jsfiddle.net/abnitchauhan/v7tdLr1j/2/

图表运行到无限循环，并且仅显示0值。我只想显示数组值，直到End

Answer 1

首先，setInterval方法中没有终点。 1秒钟后它将继续通话。你甚至不能停止。首先具有单独的功能来形成数据。假设已初始化系列数据。作为全局变量。然后让Promise为您生成x点。

var promise1 = new Promise(function(resolve, reject) {
   var points [];
   setTimeout(function() {
      var x = (new Date()).getTime(), // current time
      y =next();
      points.push([x, y], false, true);
      if(your counter let says 1000 : points.lenght > 1000) {
        resolve(points) //resolve your points
      }
   }, 300);});

包装上面的函数，返回promise并调用它。

callYourDefinedFun().then(function(points) {
  // now you have points ready, series ready make your chart configuration and then 
 // call to render chart
});