Возврат значений таблицы MySQL из скрипта PHP в функцию Javascript - Live Graphing

Я искал похожие проблемы часами, но безрезультатно.

Я использую Highcharts для обновления графика каждые 3 секунды с последней записью определенной таблицы MySQL. Я использую пример кода Javascript в качестве руководства. Вот фрагмент кода, который меня интересует

var chart;
$('#container').highcharts({
  chart: {
    type: 'spline',
    animation: Highcharts.svg, // don't animate in old IE
    marginRight: 10,
    events: {
      load: function() {
        // set up the updating of the chart every 3 seconds
        var series = this.series[0];
        setInterval(function() {
          var x = (new Date()).getTime(), // current time - adjust to align with data vals
              y = getyval();
          series.addPoint([x, y], true, true);
        }, 3000);

... где функция getyval() использования $.get():

function getyval(){
  $.get('testget.php', function(output){
    alert(parseFloat(output));
  });
};

мой testget.php файл:

<?php
session_start();
$db = $_SESSION['monitorId'];
$table = $_SESSION['tableId'];
$split_table = explode("_", $table);
$param = $split_table[1];

$dbcon = mysqli_connect("localhost","root","",$db);
$query = "SELECT * FROM ".$table." ORDER BY datetime DESC LIMIT 1";
$lastentry = mysqli_query($dbcon, $query) or die('error reading table');
$row = mysqli_fetch_array($lastentry, MYSQLI_ASSOC);
$yval = $row[$param];
echo $yval;    
?>

Это все работает хорошо и хорошо, "предупреждая" последнее значение каждые 3 секунды, но когда я пытаюсь назначить переменную y к этому результату это не работает. Например, если я изменю getyval() функция для:

function getyval(){
  $.get('testget.php', function(output){
    return parseFloat(output);
  });
};

Заранее спасибо!

Источник

2 ответа

Решение

Если вы используете просто return, он вернется из анонимной функции, а не из getyval(), Вторая проблема заключается в том, что getyval() является асинхронным (вы не получите значение только после вызова). Вы должны вызвать эту функцию ранее, сохранить ее результат где-нибудь и затем использовать ее.

var yValue = null;
function getyval(){
    $.get('testget.php', function(output){
      yValue = parseFloat(output);
    });
 };
Источник

AJAX методы, такие как $.get являются асинхронными, то есть сценарий не ожидает их завершения. Функция, которую вы передали $.get может возвратить что-то, но это как бы сбрасывается в ведро с битами - возвращать его некуда.

Ваш код нуждается в небольшой переработке, чтобы в полной мере использовать асинхронность. Изменить функцию внутри setInterval к этому:

setInterval(function() {
  // current time - adjust to align with data vals
  var x = (new Date()).getTime();
  // we need to do this in here so `function(result)` can use `x`
  $.get('testget.php', function(result) {
  // this gets run when the result is received
    var y = parseFloat(result);
    series.addPoint([x, y], true, true);
  });
}, 3000);

Работа завершена, когда $.get получает свой результат и вызывает его функцию, которая выполняется всякий раз, когда работает ваш PHP.

(Вы можете быть обеспокоены тем, что асинхронная работа будет означать, что точки данных могут быть получены не в порядке. Этого не произойдет - вы задаете координату X вручную, и каждый раз, когда внешняя функция запускается, новая x создано. каждый y будет в паре с его соответствием x.)

Источник
Другие вопросы по тегам