首页 > 解决方案 > Chart.JS 只更新一次

问题描述

我使用 Chart.JS 显示来自 MySQL 数据库的一些值。到目前为止,我刚刚重新加载了整个页面以显示新数据。你可以这样做,但这并不好。

于是我尝试了Chart.JS的更新功能。

在通过浏览器重新加载后的第一次运行期间,图表 1 (MP1chart) 中的点仍会随之变化。在所有进一步的运行中,只有图表 2 (MP2chart) 中随机生成的点来回跳跃。但在我重新加载整个页面之前,图表 1 中没有任何变化。

我已经阅读了一些论坛帖子并尝试了各种解决方案。但他们都没有带来预期的成功。

我怀疑这与 PHP 是服务器端的语言有关,所以它只执行一次,然后在重新加载整个页面之前不再执行?而 Javascript 点在客户端更新。

但是,尽管我在过去几个小时内尝试过,但我并没有通过更新函数多次将我的新数据从 PHP 脚本(从 MySQL 数据库加载数据)获取到 Chart.JS 图表中。

有人至少可以告诉我解决方案的方法。一个链接和一些我目前不认识自己的关键字肯定会帮助我找到适合自己的解决方案。

对不起,如果我的英语不完美。这不是我的母语,但我尽我所能。

用于更新 Chart.JS 的 PHP + Javascript

    <script type="text/javascript">
        var x = 0;
    
          function re_load(x) {
    
    
<?php           
$phpnumber = rand(1900, 1960);
$phpnumber = $phpnumber / 1000;

echo 'var javanumber = ' .$phpnumber. ';';

?>

    
   
    
    MP1chart.data.datasets[3].data[5] = javanumber;
    MP2chart.data.datasets[3].data[2] = Math.floor(Math.random() * 10);
    MP2chart.data.datasets[3].data[3] = Math.floor(Math.random() * 10);
    
    window.MP1chart.update();
    window.MP2chart.update();
    
    
           setTimeout("re_load(x+1)",100);
    
      }
      setTimeout("re_load(x+1)",100);
    </script>

标签: javascriptphpchart.js

解决方案


推荐阅读