Highcharts xAxis date issue on Safari or Chrome for Ipad

Question

I'm having an issue displaying date on highcharts on Safari or Chrome for IPad.

Using the following code to set the format:

// Convert sharepoint date to MMM YYYY format
    for (i = 0; i < customerSortedData.length; i++) {
        if (moment(customerSortedData[i].Date, "ddd MMM DD YYYY HH:mm:ss", 'br', true).isValid()) 
        {
            customerSortedData[i].MonthYear = moment(customerSortedData[i].Date, "ddd MMM DD YYYY HH:mm:ss", 'br', true).format('MMM YYYY');
        }
    }

, it shows correctly on windows Chrome browser, like 'Apr 2017', 'May 2017'.....'Feb 2018', 'Mar 2018".

The same chart on IPad shows: 'Aug 2017', 'Feb 2018', 'Dec 2017', 'Oct 2017', 'Jan 2018', 'Apr 2017' and then 'Invalid date'. It is expected to show last 12 months in order, but it shows 6 dates only.

Could you please help me to figure out how to fix it?

Just tested on Android and it works fine. The problem must be on IOS. — Muskts
It was deprecated issue on moment.js. Just convert the date to string right before sent to highcharts works. — Muskts

Hayfa Hayfa · Accepted Answer · 2018-04-20T19:55:50

If your customerSortedData array is not sorted by customerSortedData.Date , it could be the source of the problem. Highcharts needs the x values to be sorted.

See this question for further details : Highcharts error 15

Highcharts xAxis date issue on Safari or Chrome for Ipad

1 Answers