javascript - Data From Ajax Response Can't Be Loaded In HighChart -
i have data ajax response in array, here is:
"attd": [ { "y": 1, "name": "attendance", "sliced": true, "selected": true }, { "y": 1, "name": "spj in town", "sliced": true, "selected": true } ]
i want pass result highchart, here's code:
success: function(rs) { var attdchart = $(".attdchart"); attdchart.unbind(); var jsondata = json.parse(rs); if (jsondata.success) { var data = jsondata.attd; var data_array = []; $.each(data, function(key, value){ data_array.push(value); }); $('#containerpiechart').highcharts({ chart: { plotbackgroundcolor: null, plotborderwidth: null, plotshadow: false, type: 'pie', height: 200, marginright: 60 }, title: { text: '' }, tooltip: { pointformat: '{series.name}: <b>{point.percentage:.1f}%</b>' }, plotoptions: { pie: { allowpointselect: true, cursor: 'pointer', datalabels: { enabled: false, format: '<b>{point.name}</b>: {point.percentage:.1f} %', style: { color: (highcharts.theme && highcharts.theme.contrasttextcolor) || 'black' } }, showinlegend: true } }, legend: { align: 'right', verticalalign: 'top', layout: 'vertical', x: 0, y: 0 }, series: data_array }); }
i tried use console.log
, here result:
it show result. assumed error in series: data_array
cause when give hard code in there, chart showed.
cause code:series: data_array
,there no chart show.help me please...
here's sample code pie chart how ,
var options1={ chart:{ renderto: 'pie_chart', type: 'pie', options3d:{ enabled: true, alpha: 45, beta: 0 } }, title: { text: 'title' }, xaxis: { categories: [] }, yaxis: { title: { text: 'time fixed', }, labels: { overflow: 'justify' }, tooltip:{ formatter: function() { return this.series.name +': '+ this.y; } } }, plotoptions: { pie: { allowpointselect: true, cursor: 'pointer', depth: 35, datalabels: { enabled: true }, showinlegend: true }, series: { animation:{ duration: 1000} } }, legend: { layout: 'vertical', align: 'right', verticalalign: 'top', x: -10, y: 50, floating: true, borderwidth: 1, backgroundcolor: ((highcharts.theme && highcharts.theme.legendbackgroundcolor) || '#ffffff'), shadow: true }, credits: { enabled: false }, series: [] } // chart = new highcharts.chart(options1); $.getjson("your_ajax_call_file.php", function(json){ $.each(json, function(key, value) { var series = {}; // <-------------------- moved , changed object series.name = key; series.data = value; options1.series.push(series); // <-------- pushing series object }); var chart = new highcharts.chart(options1); });
just tried out method , should helps . remember put series array in var options1.
Comments
Post a Comment