mostafaxcali
Posts: 4
Joined: Mon Dec 20, 2021 6:37 am

Getting h.data.slice is not a function error

Hello,

When i try to add this code snippet to my chart:

Code: Select all

                data: {
                    firstRowAsNames: false,
                    columnsURL: data,
                    enablePolling: true
                },
i'm getting the following error:

Code: Select all

Uncaught TypeError: h.data.slice is not a function
    at highstock.src.js:56215
    at Array.forEach (<anonymous>)
    at f.updateNavigatorSeries (highstock.src.js:56179)
    at f.init (highstock.src.js:55992)
    at new f (highstock.src.js:55120)
    at d.<anonymous> (highstock.src.js:56562)
    at highstock.src.js:1657
    at Array.forEach (<anonymous>)
    at K (highstock.src.js:1654)
    at d.f.firstRender (highstock.src.js:31954)
My goal is to get my chart to automatically refresh chart data when there is new data from the api. if i remove that code snippet for

Code: Select all

data: data,
then the chart renders fine. However it obviously won't automatically refresh.

here's my full code:

Code: Select all

function leanChart() {
    Highcharts.setOptions({
        time: {
            timezone: 'America/New_York'
        }
    });
    Highcharts.getJSON('/api/certainstocks', function (data) {
        Highcharts.stockChart('container', {
            rangeSelector: {
                enabled: false,
            },

            title: {
                text: 'Index stocks'
            },

            chart: {
                spacingRight: "10"
            },
            series: [{
                name: 'Stocks',
                data: {
                    firstRowAsNames: false,
                    columnsURL: data,
                    enablePolling: true
                },
                tooltip: {
                    valueDecimals: 2
                },
                threshold: 0,
                negativeColor: '#ff6161',
                color: '#2f95fa',
            }],
        });
    });
}
thanks for your help
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Getting h.data.slice is not a function error

Hello,

Welcome to our forum and thanks for contacting us with your question!

There is such a thread on StackOverflow. You probably get an object instead of an API, which crashes the error "someObj.slice is not a function (...)".

https://stackoverflow.com/questions/401 ... highcharts

Let me know if that was what you were looking for!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/
mostafaxcali
Posts: 4
Joined: Mon Dec 20, 2021 6:37 am

Re: Getting h.data.slice is not a function error

michal.f wrote: Mon Dec 20, 2021 4:28 pm Hello,

Welcome to our forum and thanks for contacting us with your question!

There is such a thread on StackOverflow. You probably get an object instead of an API, which crashes the error "someObj.slice is not a function (...)".

https://stackoverflow.com/questions/401 ... highcharts

Let me know if that was what you were looking for!
Best regards!
Hi Michal,

Thanks for your quick reply! I checked my data and its returning as an array of arrays as expected.
here's what data is being returned as:

Code: Select all

[[1640019540000.0,780],[1640019600000.0,51],[1640019660000.0,-8],[1640019720000.0,-3],[1640019780000.0,-221],[1640019840000.0,-9],[1640019900000.0,-198],[1640019960000.0,-161],[1640020020000.0,501],[1640020080000.0,616],[1640020140000.0,-580],[1640020200000.0,154],[1640020260000.0,34],[1640020320000.0,-248],[1640020380000.0,837],[1640020440000.0,-93],[1640020500000.0,-26],[1640020560000.0,-927],[1640020620000.0,341],[1640020680000.0,-926],[1640020740000.0,-913]]
As mentioned, my chart works fine if i use this:

Code: Select all

            series: [{
                data: data,
                tooltip: {
                    valueDecimals: 2
                },
                threshold: 0,
            }],
and it fails when i enable polling like this:

Code: Select all

            series: [{
                data: {
                    firstRowAsNames: false,
                    rowsURL: data,
                    enablePolling: true
                },
                tooltip: {
                    valueDecimals: 2
                },
                threshold: 0,
            }],
Is it something to do with the chart building before the data arrives possibly? if so what would be the fix? Please advise

Thank you
mostafaxcali
Posts: 4
Joined: Mon Dec 20, 2021 6:37 am

Re: Getting h.data.slice is not a function error

I have even added my data directly to rowsURL and it still gives the same exact error:

Code: Select all

                data: {
                    firstRowAsNames: false,
                    rowsURL: [
                        [1640019540000.0, 780],
                        [1640019600000.0, 51],
                        [1640019660000.0, -8],
                        [1640019720000.0, -3],
                        [1640019780000.0, -221],
                        [1640019840000.0, -9],
                        [1640019900000.0, -198],
                        [1640019960000.0, -161],
                        [1640020020000.0, 501]
                    ],
                    enablePolling: true
                },
error:

Code: Select all

highstock.src.js:56215 Uncaught TypeError: h.data.slice is not a function
    at highstock.src.js:56215
    at Array.forEach (<anonymous>)
    at f.updateNavigatorSeries (highstock.src.js:56179)
    at f.init (highstock.src.js:55992)
    at new f (highstock.src.js:55120)
    at d.<anonymous> (highstock.src.js:56562)
    at highstock.src.js:1657
    at Array.forEach (<anonymous>)
    at K (highstock.src.js:1654)
    at d.f.firstRender (highstock.src.js:31954)
mostafaxcali
Posts: 4
Joined: Mon Dec 20, 2021 6:37 am

Re: Getting h.data.slice is not a function error

I solved it. Leaving the answer here for anyone else who runs into this issue:

my original code:

Code: Select all

function leanChart() {
    Highcharts.setOptions({
        time: {
            timezone: 'America/New_York'
        }
    });
    Highcharts.getJSON('/api/certainstock', function (data) {
        Highcharts.stockChart('container', {
            rangeSelector: {
                enabled: false,
            },
            title: {
                text: 'Index stocks'
            },
            series: [{
                name: 'Stocks',
                data: {
                    firstRowAsNames: false,
                    rowsURL: data,
                    enablePolling: true
                },
                tooltip: {
                    valueDecimals: 2
                },
                threshold: 0,
                negativeColor: '#ff6161',
                color: '#2f95fa',
            }],
        });
    });
}
working code:

Code: Select all

function leanChart() {
    Highcharts.setOptions({
        time: {
            timezone: 'America/New_York'
        }
    });
    var endpoint = '/api/certainstock'
    Highcharts.stockChart('container', {
            rangeSelector: {
                enabled: false,
            },
            title: {
                text: 'Index stocks'
            },
        navigator: {
            enabled: false
        },

        scrollbar: {
            enabled: false
        },

        exporting: {
            enabled: false
        },
        data: {
            firstRowAsNames: false,
            rowsURL: endpoint,
            enablePolling: true
        },
        series: [{
            name: 'Stocks',
            threshold: 0,
            negativeColor: '#ff6161',
            color: '#2f95fa',
        }],
    });
}

Code: Select all

Highcharts.getJSON
does NOT work with

Code: Select all

enablePolling: true
. Instead i saved it out to a variable called endpoint, Also data shouldn't be inside of series. Instead I pulled it out as a top level property.
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Getting h.data.slice is not a function error

Hi,

I'm glad you found the solution!
Thanks for sharing your solution with others.

Feel free to ask any further questions!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/

Return to “Highcharts Stock”