javascript - HIGHCHARTS PIE - APPLYING AJAX, REFRESH CHART -
im new in js/ajax/json, want apply ajax code chart can redraw depend on data gets in database. line of code has no errors, not refreshing itself. please me make chart dynamic. help/comments/suggestions appreciated.
here's code: data.php
$<?php $con = mysql_connect("localhost","root",""); if (!$con) { die('could not connect: ' . mysql_error()); } mysql_select_db("survey_processor", $con); $result = mysql_query("select msv_variants.var_text, b.count msv_variants, (select ans_var_id ,count(*) count (select ans_var_id msv_answers ans_que_id = '11') group ans_var_id) b msv_variants.var_opt_id = b.ans_var_id , msv_variants.var_que_id = '11' "); $rows = array(); while($r = mysql_fetch_array($result)) { $row[0] = $r[0]; $row[1] = $r[1]; array_push($rows,$row); } print json_encode($rows, json_numeric_check); mysql_close($con); ?>
pie.js
$(document).ready(function() { var options = { chart: { renderto: 'container', plotbackgroundcolor: null, plotborderwidth: null, plotshadow: false }, title: { text: 'web sales & marketing efforts' }, tooltip: { formatter: function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; } }, plotoptions: { pie: { allowpointselect: true, cursor: 'pointer', datalabels: { enabled: true, color: '#000000', connectorcolor: '#000000', formatter: function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; } } } }, series: [{ type: 'pie', name: 'browser share', data: [] }] } $.getjson("data.php", function(json) { options.series[0].data = json; chart = new highcharts.chart(options); }); });
please me in project. thankyou
you need update data in chart, example:
$(document).ready(function() { var options = { chart: { renderto: 'container', plotbackgroundcolor: null, plotborderwidth: null, plotshadow: false, // add code below: events: { load: function() { var series = this.series[0]; settimeout(function() { $.getjson("data.php", function(json) { series.setdata(json); }); } } } }, //rest of options , code }; });
Comments
Post a Comment