Highcharts 动态图表（按一定时间间隔更新） PHP+MySql 示例

Posted 2023-03-14

【中文标题】Highcharts 动态图表（按一定时间间隔更新） PHP+MySql 示例

【英文标题】：Highcharts Dynamic Chart (Updating over certain interval) PHP+MySql Example

【发布时间】：2013-05-08 14:20:32

【问题描述】：

我正在尝试使用this 演示使其与 php 和 mysql 一起使用，以便在一定间隔后我从数据库中获取更新的值。

当我使用时

// using random value using javascript
setInterval(function() 
        var x = (new Date()).getTime(), // current time
        var y = Math.random();
        series.addPoint([x, y], true, true);
        , 5000);

我明白了

但是当我尝试使用 Ajax 函数时

var t;
setInterval(function() 
    var x = (new Date()).getTime(), // current time
    $.ajax(
        type:'post',
        url:'blahblah.php',
        success:function(data)
        
             t = data;   // data will be a random numeric value
        
    );        
    series.addPoint([x, t], true, true);
    , 5000);

图表变成

blahblah.php

echo rand(10, 99);

我无法确定为什么该行在每次 ajax 调用时都会消失。此外，点的绘制也不正确。返回值始终大于 10，但正如您在第二张图表中看到的那样，绘图范围是 -2 到 8

我似乎没有找到合适的 mysql 示例来处理这种图表（在一定间隔后自动更新）

还有其他替代方法可以从服务器获取数据并在setInterval 函数中使用该值吗？

【问题讨论】：

我不明白问题/问题。如果您没有从服务器返回正确的值，则需要查看您的 sql 以及返回的数据是什么。请注意，发布的示例旨在返回并向图表添加单个数据点，而不是用新数据集替换数据...

我已经更正了一个问题（从服务器端返回正确的值），但线条仍然消失，图表上只显示了唯一的点，而且随机位置也显示了

【参考方案1】：

将series.addPoint([x, t], true, true); 放在成功函数中 - 否则 't' 将是未定义的，这将与图表混淆。

【讨论】：

t 在$.ajax 之外定义。所以它应该在范围内，不是吗？不过，我会试试你的建议，看看是否有帮助。

我想通了。我不得不parseInt(t)。虽然我也不得不在成功内转移addPoint。

【参考方案2】：

我认为您总是在同一时间戳中绘制值。 并确保 't' 中的值是数字。

【讨论】：

t 始终是数字。但由于某种原因，使用ajax 调用会使线条消失。