Update /refresh data from php

[tceydeliler]

Hi, I have two pie charts:

<div  id="dash_avg_in" class="row center-align" style="text-align: center;">
  <span class="chart easy-pie main-pie" style:"display:inline-block;" data-percent="<?php echo  (round(($row['AVG(totalKbpsin)']/1024),2)/0.4);?> ">
    <span class="percent white-text"></span>
      </span>
</div>

<div id="dash_avg_out" class="row center-align" style="text-align: center;">
  <span class="chart2 easy-pie main-pie" style:"display:inline-block;" data-percent="<?php echo  (round(($row['AVG(totalKbpsout)']/1024),2)/0.4);?>">
    <span class="percent white-text"></span>
  </span>
</div>

And their plugins:

$(function() {
  $('.chart').easyPieChart({
   // some visualization parameters here//
    onStep: function(from, to, percent) {
    $(this.el).find('.percent').text(Math.round(percent));
    }
  });
  var chart = window.chart = $('.chart').data('easyPieChart');
});

$(function() {
  $('.chart2').easyPieChart({
   // some visualization parameters here//
    onStep: function(from, to, percent) {
      $(this.el).find('.percent').text(Math.round(percent));
    }
  });
  var chart = window.chart = $('.chart2').data('easyPieChart');
  });

Data percent comes from a MySQL query in php part: data-percent="<?php echo (round(($row['AVG(totalKbpsout)']/1024),2)/0.4);?>" and data-percent="<?php echo (round(($row['AVG(totalKbpsout)']/1024),2)/0.4);?>"

I try to update pie chart every 5 min. to read new values from MySQL query and php. In able to this, I have another php page to call new data (dash_avg_max_min.php):

<?php
//some requirements here

$query = "SELECT CONCAT(cdate,' ',chour,':00:00') AS ctime ,sum(bytesin*0.000002222) as totalKbpsin, sum(bytesout*0.000002222) as totalKbpsout FROM traffic_user_daily group by cdate,chour HAVING ctime >= now() - INTERVAL 1 DAY ";
$result = $conn->query($query);
$query_IO ="SELECT MAX(totalKbpsin),MAX(totalKbpsout),AVG(totalKbpsin),AVG(totalKbpsout) FROM (" . $query . ") a";              
$result_IO = $conn->query($query_IO);
if($result_IO->num_rows > 0) { 
$row = $result_IO->fetch_array(MYSQLI_ASSOC);
?>
//MAX IN
<h1 id="max_in" class="valign right-align indigo-text darken-4" style="font-size:80px;margin:0"><?php echo  round(($row['MAX(totalKbpsin)']/1024),2);?> </h1>

//MAX_OUT
<h1  id="max_out" class="valign right-align red-text accent-4" style="font-size:80px;margin:0"><?php echo  round(($row['MAX(totalKbpsout)']/1024),2);?> </h1>

//AVG_IN
<span id="avg_in"class="chart easy-pie main-pie" style:"display:inline-block;" data-percent="<?php echo  (round(($row['AVG(totalKbpsin)']/1024),2)/0.4);?> ">

//AVG_OUT
<span id="avg_out" class="chart2 easy-pie main-pie" style:"display:inline-block;" data-percent="<?php echo  (round(($row['AVG(totalKbpsout)']/1024),2)/0.4);?>">


<?php echo  (round(($row['AVG(totalKbpsin)']/1024),2)/0.4);?> 
<?php echo  (round(($row['AVG(totalKbpsout)']/1024),2)/0.4);?>

<?php } ?>

To refresh new data I use this code:

    setTimeout(function() {
        $('.chart').data('easyPieChart').update(40);
    }, 5000);

And plugin becomes this:

$(function() {
  $('.chart').easyPieChart({
    //some visualization here//
    onStep: function(from, to, percent) {
      $(this.el).find('.percent').text(Math.round(percent));
    }
  });
  var chart = window.chart = $('.chart').data('easyPieChart');
  setTimeout(function() {
    $('.chart').data('easyPieChart').update("dash_avg_max_min.php #avg_in");
  }, 5000);

  });

But, not successfull after 5 sec. I get NaN

What sould I do to refresh pie chart with new value?

[tceydeliler]

Sorry, I know it is not an issue. But dont know where I ask it.

[tceydeliler]

Strange, There is no answer in anywhere about this.