Google 图表 mysql PHP

Question

正在尝试获取 Google 图表以通过 php 从本地 mysql 数据库加载数据。页面显示空白。基于此 example code。知道如何解决吗？

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={
    'modules':[{
        'name':'visualization',
        'version':'1',
        'packages':['corechart']
    }]
}"></script>

<script type="text/javascript">
    google.setOnLoadCallback(drawChart);

    function drawChart() {
        var data = google.visualization.arrayToDataTable([
            ['Time', 'Temperature'],
            <?php
                $con = mysqli_connect("localhost", "root", "pass", "TempDB2");
                $query = "SELECT * FROM TempMeas";
                $result = mysqli_query($con, $query);

                mysqli_close($con);

                while ($row = mysqli_fetch_array($result))
                {
                    $time = $row['MeasTime'];
                    $temp = $row['Temp'];
                    echo "['$time', $temp],";
                }
            ?>
        ]);

        var options = {
            title: 'Company Performance',
            curveType: 'function',
            legend: { position: 'bottom' }
        };

        var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

        chart.draw(data, options);
    }
</script>
</head>
<body>
    <div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>

Answer 1

过去几天我一直在搞这个，我发现最好的解决方案是将 MySQL 查询与图表部分分离并从 JSON 文件或 php 页根据 https://developers.google.com/chart/interactive/docs/php_example#getdataphp-file

这样您就可以从静态 JSON 文件开始并确保您的图表正确显示。一旦成功，然后使用 PHP 和 MySQL 查询重新创建相同的 JSON 文件。

    var jsonData = $.ajax({
      url: "jsonData.php",
      dataType: "json",
      async: false
      }).responseText;

    var data = new google.visualization.DataTable(jsonData);

确保您的 JSON 正确是最重要的。看起来您正在输入 DATETIME，这意味着如果格式不正确，您的图表将不会显示。需要 "Date(2016,05,26,04,10)"

JSONLint 是你的朋友。

Google 图表 mysql PHP

Google Charts mysql PHP

javascript

php

mysql

charts