this is my code:
<?php
$pfstatetext = get_mypfstate();
$cpuusage= cpu_usage();
?>
<script>
var myVar=setInterval(function(){myTimer()},10000);
function myTimer() {
var ctx2 = document.getElementById("chart-area2").getContext("2d");
var myPie2 = new Chart(ctx2).Pie(pieData2);
}
</script>
<div id="show">
<canvas id="chart-area2" width="300" height="300"/>
</div>
<script>
var pieData2 = [
{
value: <?= $pfstatetext;?>,
color:"#F7464A",
highlight: "#FF5A5E",
label: "Red :"
},
{
value: <?= $cpuusage; ?>,
color: "#46BFBD",
highlight: "#5AD3D1",
label: "Green"
},
{
value: 100,
color: "#FDB45C",
highlight: "#FFC870",
label: "Yellow"
},
{
value: 40,
color: "#949FB1",
highlight: "#A8B3C5",
label: "Grey"
},
{
value: 120,
color: "#4D5360",
highlight: "#616774",
label: "Dark Grey"
}
];
window.onload = function(){
var ctx2 = document.getElementById("chart-area2").getContext("2d");
var myPie2 = new Chart(ctx2).Pie(pieData2);
};
</script>
'$pfstatetext' and '$cpuusage' values will be changing automatically. the above code is refreshing the pie chart every 10 seconds. But the values of the pieData2 is displaying the pie chart with the values, generated when the page was loaded, every time the pie chart refreshes after 10 seconds.
When I reload the page the pie chart will be drawn with different and updated values of '$pfstatetext' and '$cpuusage' and these same values will be displayed every time the pie chart refreshes after 10 seconds, but not with changing values of '$pfstatetext' and '$cpuusage'.
So what changes will i have to make so that changing values of '$pfstatetext' and '$cpuusage' will be taken by pie chart every time it refreshes after 10 seconds?