I have a Pie Chart
and want to auto refresh
it every 5 seconds. This is my code:
<script type="text/javascript"> google.load("visualization", "1", { packages: ["corechart"] }); google.setOnLoadCallback(drawChart); function drawChart() { var options = { width: 900, height: 500, title: 'Partition des tickets', legend: 'left', is3D: true }; $.ajax({ type: "POST", url: "Home.aspx/GetPieChartData", data: '{}', contentType: "application/json; charset=utf-8", dataType: "json", success: function (r) { var data = google.visualization.arrayToDataTable(r.d); var chart = new google.visualization.PieChart($("#chart_Pie")[0]); chart.draw(data, options); }, failure: function (r) { alert(r.d); }, error: function (r) { alert(r.d); } }); } </script>
Advertisement
Answer
i fixed it , if any one want to update any google chart dynamicly you just need to add update() function like you see
<script type="text/javascript"> google.load("visualization", "1", { packages: ["corechart"] }); google.setOnLoadCallback(drawChart); function drawChart() { var options = { width: 900, height: 500, title: 'Partition des tickets', legend: 'left', is3D: true, }; $.ajax({ type: "POST", url: "Home.aspx/GetPieChartData", data: '{}', contentType: "application/json; charset=utf-8", dataType: "json", success: function (r) { var data = google.visualization.arrayToDataTable(r.d); var chart = new google.visualization.PieChart($("#chart_Pie")[0]); chart.draw(data, options); updateChart(); }, failure: function (r) { alert(r.d); }, error: function (r) { alert(r.d); } }); function updateChart() { $.ajax({ type: "POST", url: "Home.aspx/GetPieChartData", data: '{}', contentType: "application/json; charset=utf-8", dataType: "json", success: function (r) { var data = google.visualization.arrayToDataTable(r.d); var chart = new google.visualization.PieChart($("#chart_Pie")[0]); chart.draw(data, options); }, failure: function (r) { alert(r.d); }, error: function (r) { alert(r.d); } }); setTimeout(function () { updateChart() }, 1000); }; } </script>