为什么Google图表未在图表中显示数据

Question

我不明白为什么我的Google图表未显示数据？ 代码没有显示错误，但是图表中没有数据。 请让我知道为什么会发生。谢谢。 这是我的PHP代码。

<?php
$query="SELECT Time, Temperature FROM (SELECT Time, Temperature FROM fish_tank_parameter order by Time desc limit 10)as a order by Time";
$result=db_connection($query);
function db_connection($query){
    $link=mysqli_connect("localhost","root","","hfjq_race_info");
    return mysqli_query($link,$query);
}

$rows = array();
$table = array();

$table['cols'] = array(
    array(
        'label' => 'Time',
        'type' => 'number'
    ),
    array(
        'label' => 'Temperature',
        'type' => 'number'
    )
);

while($row = mysqli_fetch_array($result)){
    $sub_array = array();
    $datetime = explode("." , $row["Time"]);
    $sub_array[] = array(
        "v" => 'Date('. $datetime[0] .'000)'
    );
    $sub_array[] = array(
        "v" => $row["Temperature"]
    );
    $rows[] = array(
        "c" => $sub_array
    );
}
$table['rows'] = $rows;
$jsonTable = json_encode($table, JSON_NUMERIC_CHECK);
?>

这是我的JavaScript代码。

        google.charts.load('current',{'packages':['corechart']});
        google.charts.setOnLoadCallback(drawChart);

        function drawChart(){
            $.ajax({
                url: "http://localhost/test/get_temp.php",
                dataType: "json",
                    var data = new google.visualization.DataTable(jsonData);
                    var chart = new google.visualization.LineChart(document.getElementById('tempflot'));
                    chart.draw(data,{width: 800, height: 400});
                }
            });
        }

Answer 1

假设您的json数据正确生成，则需要在php文件中回显json数据，并在javascript中调整drawChart函数。

PHP：

echo $jsonTable;  // just before closing php tag

JS：

function drawChart() {
    var jsonData = $.ajax({
        url: "http://localhost/test/get_temp.php",
        dataType: "json",
        async: false
    }).responseText;

    // Create our data table out of JSON data loaded from server.
    var data = new google.visualization.DataTable(jsonData);

    // Instantiate and draw our chart, passing in some options.
    var chart = new google.visualization.LineChart(document.getElementById('tempflot'));
    chart.draw(data,{width: 800, height: 400});
}

这在Google图表文档中列出： https : //developers.google.com/chart/interactive/docs/php_example