Highcharts live graph: Accessing Datetime data returns an [Object] instead of [Datetime, Int]

Question

I created a minimal reproduction of this problem, so as to make it easy for someone to help me figure this out.

This is what I have: http://jsfiddle.net/tDW7e/1/

    $(function () {
$(document).ready(function () {
    Highcharts.setOptions({
        global: {
            useUTC: false
        }
    });

    var chart;
    $('#container').highcharts({
        chart: {
            type: 'spline',
            //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];
                    setInterval(function () {
                        var x = (new Date()).getTime(), // current time
                            y = Math.random();
                        series.addPoint([x, y], true, true);
                        document.getElementById('dbg').innerHTML = series.toString();
                    }, 1000);
                }
            }
        },
        xAxis: {
            type: 'datetime',
            tickPixelInterval: 150
        },
        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;
            })()
        }]
    });
});
});

HTML:

    <script src="http://code.highcharts.com/highcharts.js"></script>
    <script src="http://code.highcharts.com/modules/exporting.js"></script>
    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
    <div id="dbg" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

I edited the Live Chart demo, to write the value of the data to a second div. I am trying to perform a check to make sure that the most recent DateTime value in the graph is not the most recent in my database. I cannot perform this check because what should be an array of [DateTime, Int] becomes an array of [Object].

Any help is appreciated!

Answer 1

First of all, in your example you are using series which always is array of objects.

Second thing, each of points is also object, otherwise you couldn't use for example point.update() to update new options etc.

Third thing, in your example you are creating points as:

                    data.push({
                        x: time + i * 1000,
                        y: Math.random()
                    });

Which obviously is an object, not an array.

If you want to get actual point, use: series.options.data, and if using proper format (as you said) use this: http://jsfiddle.net/tDW7e/4/