How to insert json within an array into highcharts?

Question

I generate an array like so in php with json nested in the array under chartData:

array:1 [▼
  0 => array:18 [▼
    "id" => 1
    "chart_title" => "A title"
    "chart_type" => "line"
    "chartData" => "[[1470406561000,2116],[1470406561000,2116],[1470406562000,2116]]"
  ]
]

I want access the chartData json within this array and insert it into a HighCharts series.

I've tried using: window['chart' + chartData.id].series[0].addPoint(chartData, true, shift);

and also a forEach loop:

chartData.forEach(function(dataPoint){
                        console.log(dataPoint);
                        window['chart' + chartData.id].series[0].addPoint(dataPoint[0], true);
                         dataPoint.slice(0,30).forEach(function(point){
                             window['chart' + chartData.id].series[0].addPoint(point, true, shift);
                         });
                    });

Both don't show any errors in the console and the values don't show up on the chart. If I console.log(dataPoint); I get what looks like the correct output: [[1470406561000,2116],[1470406561000,2116],[1470406562000,2116]]

How would I insert the chartData json into a highchart series?

kevinabraham · Accepted Answer · 2016-08-25 07:51:12Z

1

My issue was the JSON was not being parsed by jQuery on the view and essentially passing it to the highcharts series raw. By adding jQuery.parseJSON(chartData); It was able to parse correctly and display on the chart.

answered Aug 25, 2016 at 7:51

kevinabraham

1,4374 gold badges31 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

vijayP · Accepted Answer · 2016-08-25 07:15:46Z

0

With jQuery you can try like this:

    var dataPoint =   [[1470406561000,2116],
                       [1470406561000,2116],
                       [1470406562000,2116]];  

    var chart = $('#chart2').highcharts();
    chart.series[0].setData(dataPoint);

    $('#chart2').highcharts().redraw();

Please make sure you change chart id i.e. #chart2 correctly as per your code.

answered Aug 25, 2016 at 7:15

vijayP

11.5k5 gold badges28 silver badges42 bronze badges

7 Comments

kevinabraham Over a year ago

Thanks @vijayP I tried this works without any issue if I set the dataPoint var in jquery but if I try to set it using using the array like var dataPoint = chartData; It draws the chart like so oi68.tinypic.com/29djria.jpg

vijayP Over a year ago

image you posted is not accessible to me as of now. can you console.log(chartData) before statement dataPoint = chartData; and check it.

kevinabraham Over a year ago

I console.logged the data and the output is [[1470406561000,2116],[1470406561000,2116],[1470406562000,2116]]

vijayP Over a year ago

its same as other one right...? any error in console? Logically it should work.

kevinabraham Over a year ago

Added jQuery.parseJSON(chartData); and that fixed it. Thanks for your help Vijay

|

Collectives™ on Stack Overflow

How to insert json within an array into highcharts?

2 Answers 2

Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related