MrSteve
MrSteve

Reputation: 499

Bug in Highcharts where negative numbers in data seem to cause bug with graph drawing

I seem to have found a plotting bug see this example here: http://jsfiddle.net/MrSteve/Smu6r/

Source data:

<script src="http://gosargon.com/iconectiv/portWon.js"></script>

Javascript:

$('#container').highcharts('StockChart', {

    chart: { },
    credits: {
            enabled: true
        },
    yAxis: {
        startOnTick: false,
        endOnTick: false,
        min: -20000,
        max: 20000,
        plotBands: [{
            from: 0,
            to: 60000,
            color: 'white'
        }, {
            from: -60000,
            to: 0,
            color: 'rgba(68, 170, 213, 0.1)'
        }]
    },
    rangeSelector: {
        buttonTheme: { // styles for the buttons
            fill: 'none',
            stroke: 'none',
                'stroke-width': 0,
            r: 8,
            style: {
                color: '#039',
                fontWeight: 'bold'
            },
            states: {
                hover: {},
                select: {
                    fill: '#039',
                    style: {
                        color: 'white'
                    }
                }
            }
        },
        inputBoxBorderColor: 'gray',
        inputBoxWidth: 120,
        inputBoxHeight: 18,
        inputStyle: {
            color: '#039',
            fontWeight: 'bold'
        },
        labelStyle: {
            color: 'silver',
            fontWeight: 'bold'
        },
        selected: 1
    },

    series: [{
        name: 'Net',
        data: portsNetData
    }
            ]
});

});

Look at first few days of March and the hover shows all positive numbers by day (as does the json data) but the line takes a weird dip below zero similar to 1/27 -7661 value, but in March portion of X axis. I see the same problem in Chrome, Safari and Firefox.

The problem seems to be related to having negative data values. When I remove them the problem goes away.

Suggestions and help welcome.

Thanks, Steve

Upvotes: 0

Views: 224

Answers (1)

Mark
Mark

Reputation: 108512

If you check the javascript for errors you'll see this one:

http://www.highcharts.com/errors/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.

This appears to be misleading because at first glance you data looks fine.

BUT, the with Date.UTC function, the month is zero based so some of your dates like

Date.UTC(2014,01,31)  // this is February the 31st!?!

don't make any sense and Date.UTC is trying to make meaning out of them.

Upvotes: 2

Related Questions