Reputation: 247
I am using highchart js for creating line chart.I am using php for json response. Problem is when i am populating the chart from response the years are display but line is not drawing.
$(document).ready(function () {
$.ajax({
type: "GET",
url: 'resp_highChart.php',
dataType: "json",
contentType: "application/json",
success: function (response) {
console.log(response);
// draw chart
$('#container').highcharts({
chart: {
type: 'line'
},
title: {
text: 'Year Wise Sales Data'
},
subtitle: {
text: ''
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr']
},
yAxis: {
title: {
text: 'Sold Value'
},
labels: {
formatter: function () {
return this.value + '';
}
}
},
plotOptions: {
line: {
dataLabels: {
enabled: false
},
enableMouseTracking: true
}
},
series: response
});
}
});
});
my response format is below
[{"name":"2012","data":"[692101643,716334837,776991835,769420169 ]"},{"name":"2013","data":"[860859252,825852169,895524501,892930333 ]"}]
Upvotes: 1
Views: 874
Reputation: 3554
The problem here is that your data values are being read as strings and not arrays.
I created an example fiddle using your chart options and your JSON data directly inserted: http://jsfiddle.net/brightmatrix/143bzv1s/
The chart works correctly with the format as follows. Notice there are no quote marks around the data arrays.
series: [
{"name":"2012","data":[692101643,716334837,776991835,769420169 ]},
{"name":"2013","data":[860859252,825852169,895524501,892930333 ]}
]
I hope this is helpful for you!
Also, thank you very much for including sample data in your question. That was extremely helpful.
Upvotes: 1