Highcharts - Dyanmic graph with no initial data

问题:

If you open this JSFiddle with the dynamic spline update it loads the series with 20 points before it starts updating every second.

Example

I don't want to display any initial data and let the interval add the points as they come in.

So I change:

series: [{
            name: 'Random data',
            data: (function() {
                // generate an array of random data
                var data = [],
                    time = (new Date()).getTime(),
                    i;

                for (i = -19; i <= 0; i++) {
                    data.push({
                        x: time + i * 1000,
                        y: Math.random()
                    });
                }
                return data;
            })()
        }]

to

series: [{
            name: 'Random data',
            data: []
        }]

But it doesnt add the points. Is there something I am missing?

回答1:

Change your load function so that the shift parameter doesn't apply before you've added your 20 values, see this jsfiddle

load: function() {

    // set up the updating of the chart each second
    var series = this.series[0],
        maxSamples = 20,
        count = 0;
    setInterval(function() {
        var x = (new Date()).getTime(), // current time
            y = Math.random();
        series.addPoint(
            [x,y]
            , true
            , (++count >= maxSamples)
        );
    }, 1000);
}

回答2:

The third parameter of addPoint is set if you what to shift a point after add this one.

So, what is happening ? You're adding a point and then removing it.

Change:

series.addPoint([x, y], true, true);

To:

series.addPoint([x, y], true);

Demo

Reference

• http://api.highcharts.com/highstock#Series.addPoint()