Question

The problem: I am querying the Yahoo Finance API succesfully and I would like to output a multi dimensional array to a Highstock chart. However, the data is only rendering in the navigator and not the main chart for some zoom levels.

The question: Can anybody please tell me where I am going wrong, or is this a bug?

Note: Highstocks expects data like this in series.data: http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?

Here is a live demo: http://stevebrown.co/highstock/

var quoteData = [];

$(function() {

    var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.historicaldata%20where%20symbol%20%3D%20%22YHOO%22%20and%20startDate%20%3D%20%222009-09-11%22%20and%20endDate%20%3D%20%222010-03-10%22&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=";

    $.getJSON(url, function(

        $.each(data.query.results.quote, function(index, value) {
            var theTime = value.Date;
            var milliTime = new Date(theTime);
            milliTime = milliTime.getTime();

            var results = [milliTime, parseFloat(value.Low), parseFloat(value.High)];

            quoteData.push(results);

        })


    });

    setTimeout("createChart()", 1000);

});

        function createChart() {

        console.log('quoteData', quoteData);

        // Create the chart
        window.chart = new Highcharts.StockChart({
            chart : {
                renderTo : 'container'
            },

            rangeSelector : {
                selected : 1
            },

            title : {
                text : 'AAPL Stock Price'
            },

            series : [{
                name : 'AAPL',
                data : quoteData,
                tooltip: {
                    valueDecimals: 2
                }
            }]
        });

    }

Answer 1

The problem is that your period comes from 2010-03-10 to 2009-09-11, should be from 2009-09-11 to 2010-03-10.
So, you just have to reverse your data array.
The following line will fix the issue.

quoteData = quoteData.reverse();