javascript - 更改 PHP 变量后 Highcharts 实时数据未更新

Question

我在页面index.html上有一个实时更新的highchart，它调用php脚本datatest.php来解析CSV文件，将结果输出为json并将其添加为图表上的新点:

$.ajax({
    url: 'datatest.php',
    success: function(point) {
        var series = chart.series[0],
            shift = series.data.length > 20; // shift if the series is longer than 20

        // add the point
        chart.series[0].addPoint(eval(point), true, shift);

        // call it again after one second
        setTimeout(requestData, 1000);  
    },
    cache: false
});

基本 PHP 脚本将“行”存储为 session 变量，以便每次调用脚本时，它都会解析 CSV 文件的下一行。 CSV 文件有两列，一列表示“hi”，一列表示“lo”。

我正在尝试向我的页面添加几个按钮，以便我可以动态更改 php 脚本返回的 CSV 文件的列。这些按钮的代码如下:

<form method="post" action ="datatest.php">
    <input type="submit" name="HighWind" value="hi"/>
    <input type="submit" name="LowWind" value="lo"/>
</form>

图表运行完美，并且使用默认(低)值更新得很好，但是当我按下上述任一按钮时，图表就会停止。这是我的 PHP 代码:

<?php 
$i = 0;
session_start();

$_SESSION['line'] = isset($_SESSION['line']) ? ++$_SESSION['line'] : 0;
$_SESSION['hiorlo'] = isset($_SESSION['hiorlo']) ? $_SESSION['hiorlo'] : "lo";

$handle = fopen('WindSpeed.csv', 'r');


while(($windVals = fgetcsv($handle, 1000, ',')) && $i <= $_SESSION['line']) {
    $i++;
}
if(!$windVals) {
   $_SESSION['line'] = 0;
}

header("Content-type: text/json");
$x = time() * 1000;

$_SESSION['hiorlo'] = isset($_POST["HighWind"]) ? $_POST["HighWind"] : "Low";


//$hiorlo POST Code
if ($_SESSION['hiorlo'] == "hi") {
    $y =  (float)$windVals[0];
} else {
    $y = (float)$windVals[1];
}

// Create a PHP array and echo it as JSON
$ret = array($x, $y);
echo json_encode($ret);

header("Location: index.html"); // Return to frontend (index.html)

?>

有趣的是，当我注释掉 header("Location: index.html") 时，我会按预期重定向到 PHP 脚本的 json 输出，并且显示的是正确的值取决于按下的按钮。但是，由于保留了标题代码，图表在按下后就会停止。

任何帮助将不胜感激!

谢谢， 凯文

Answer 1

您的方法有些错误。您似乎尝试实现动态图表刷新，为此您需要:

1. 在按钮点击时进行 ajax 调用
2. 将参数传递给函数(本例中为第 no 行。可以作为状态变量存储在 javascript 中)
3. 编写一个函数，从图表中删除之前的数据/点并添加新点。

这应该是我通常遵循的图表和动态数据推送方法。