0

I'm trying to use yahoo finance data to generate a Highcharts candlestick chart like this http://www.highcharts.com/stock/demo/candlestick-and-volume. But I keep getting this error: http://www.highcharts.com/errors/15 Highcharts Error #15

Highcharts expects data to be sorted

This happens when you are trying to create a line series or a stock chart where the data is not sorted in ascending X order. For performance reasons, Highcharts does not sort the data, instead it is required that the implementer pre-sorts the data.

My code is as follows.

$(function () {


    $.getJSON('http://websitescraper.heroku.com/?url=http://ichart.finance.yahoo.com/table.csv?s=000338.sz&callback=?', function (csvdata) {
        //console.log(csvdata);
        var arr = csvdata.split('\n').slice(1);

        var data = [];

        for (var i = arr.length-1; i >= 0; --i) {
            //console.log(arr[i]);
            var line = arr[i].split(',');
            line[0] = Date.parse(line[0]);

            line = $.map(line, function(v) {
                return parseFloat(v);
            });
            line = line.slice(0,6);
            //var j = JSON.stringify(line.slice(0,0+6));
            console.log(line);
            data.push(line);
        }
        data = JSON.stringify(data.slice(1));
        console.log(data);
        run(data);
    });




});

function run(data) {

    // split the data set into ohlc and volume
    var ohlc = [],
            volume = [],
            dataLength = data.length,
    // set the allowed units for data grouping
            /*groupingUnits = [[
                'week',                         // unit name
                [1]                             // allowed multiples
            ], [
                'month',
                [1, 2, 3, 4, 6]
            ]],*/

            i = 0;

    for (i; i < dataLength; i += 1) {
        ohlc.push([
            data[i][0], // the date
            data[i][1], // open
            data[i][2], // high
            data[i][3], // low
            data[i][4] // close
        ]);

        volume.push([
            data[i][0], // the date
            data[i][5] // the volume
        ]);
    }


    // create the chart
    $('#container2').highcharts('StockChart', {

        rangeSelector: {
            selected: 1
        },

        title: {
            text: 'Shanghai Composite Index Historical'
        },

        yAxis: [{
            labels: {
                align: 'right',
                x: -3
            },
            title: {
                text: 'OHLC'
            },
            height: '60%',
            lineWidth: 2
        }, {
            labels: {
                align: 'right',
                x: -3
            },
            title: {
                text: 'Volume'
            },
            top: '65%',
            height: '35%',
            offset: 0,
            lineWidth: 2
        }],

        series: [{
            type: 'candlestick',
            upLineColor: 'red',
            downLineColor: 'green',
            name: 'SSE',
            data: ohlc,
            /*dataGrouping: {
                units: groupingUnits
            }*/
        }, {
            type: 'column',
            name: 'Volume',
            data: volume,
            yAxis: 1
            /*dataGrouping: {
                units: groupingUnits
            }*/
        }]
    });
}

Can somebody help? Thanks a lot!

0

1 Answer 1

2

The problem is the data = JSON.stringify(data.slice(1));. It turns the array to a string, therefore Highstock doesn't recognize it. Remove JSON.stringify and it will work fine:

data = data.slice(1);

Here's the DEMO.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.