Error displaying high cards 14

Question

I am trying to draw a pie chart using tall charts, spending hours trying to figure out how to process a JSON string into a javascript array. This is what I have

gateway_useage: function(usage_data) { var options = { chart: { renderTo:'gateway-usage', plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false }, title: { text: 'Gateway Usage' }, tooltip: { pointFormat: '{series.name}: <b>{point.percentage}%</b>', percentageDecimals: 1 }, plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: true, color: '#000000', connectorColor: '#000000', formatter: function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; } }, showInLegend: true } }, series: [{ type: 'pie', name: 'Usage', }] } var serie1 = usage_data.map( function(e) { return [e.gateway, e.val]; }); options.series.push({data: serie1}); var chart = new Highcharts.Chart(options); } 

After loading the page and checking the console with the message "Unclean Highcharts Error # 14: www.highcharts.com/errors/14". What am I doing wrong, please help me

Answer 1

Error Highcharts # 14 clearly says

The value of the string sent to series.data is expected. The number of it occurs if you pass the string as a data point

the data point is yValue if your serie.data is of the form

 [y1,y2,y2] 

or

 [[x1,y1],[x2,y2],[x3,y3]] 

or

 [ { x : x1 ,y : y1 }, { x : x2 ,y : y2 }, { x : x3 ,y : y3 } ] 

In any of the above forms, the data type stored in y1 , y2 and y3 must be numeric. You can achieve this simply by using parseFloat() or parseInt() in javascript

 var serie1 = usage_data.map( function(e) { return [e.gateway, parseFloat(e.val)]; }); 

or do it in the server technology you are using. In (PHP 4> = 4.2.0, PHP 5) floatval() can be used

 $float_value_of_var = floatval("123.456");