1

您好,我尝试通过使用 json 将 Highcharts 与来自 sql 数据库的数据一起使用。

一切都在做,但我看不到任何价值

我用这个脚本得到数据:

<?php

header('content-type: text/html; charset=utf-8');

include("db.inc.php");

$con = mysql_connect(DB_SERVER, DB_USER, DB_PASSWOR
if (!$con) {
die('Could not connect: ' . mysql_error());
}

mysql_select_db(DB_NAME, $con);

$sth0 = mysql_query("SELECT `DATETIME` FROM `dg_wall24` WHERE DATETIME >
NOW()INTERVAL 1 HOUR");
$rows0 = array();
$rows0['name'] = 'DATETIME';
while($r0 = mysql_fetch_array($sth0)) {
$rows0['data'][] = $r0['DATETIME'];
}

 $sth1 = mysql_query("SELECT `dg_t01` FROM `dg_wall24` WHERE DATETIME >
 NOW()INTERVAL 1 HOUR");
 $rows1 = array();
 $rows1['name'] = 'dg_t01';
 while($r1 = mysql_fetch_array($sth1)) {
 $rows1['data'][] = $r1['dg_t01'];
 }

 $sth2 = mysql_query("SELECT `dg_h01` FROM `dg_wall24` WHERE DATETIME >
 NOW()    INTERVAL 1 HOUR");
 $rows2 = array();
 $rows2['name'] = 'dg_h01';
 while($r2 = mysql_fetch_array($sth2)) {
 $rows2['data'][] = $r2['dg_h01'];
}

 $result = array();
 array_push($result,$rows0);
 array_push($result,$rows1);
 array_push($result,$rows2);

 print json_encode($result);

 mysql_close($con);
 ?>

结果:

[{"name":"DATETIME","data":["2013-04-27 08:17:52","2013-04-27 08:22:52","2013-04-27 08:27:53","2013-04-27 08:32:54","2013-04-27 08:37:55","2013-04-27 08:42:55","2013-04-27 08:47:56","2013-04-27 08:52:57","2013-04-27 08:57:58","2013-04-27 09:02:58","2013-04-27 09:07:59","2013-04-27 09:13:00"]},{"name":"dg_t01","data":["22.40","22.40","22.40","22.40","22.30","22.30","22.40","22.40","22.40","22.40","22.40","22.40"]},{"name":"dg_h01","data":["40.20","40.40","40.50","40.80","40.70","40.70","40.80","40.90","41.00","41.00","40.90","40.70"]}]

在 Highchart 中,我可以看到 x 轴上的时间线和值的名称,但没有线和值。

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>
        <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'container',
                    type: 'line',
                    marginRight: 130,
                    marginBottom: 40
                },
                title: {
                    text: 'Dachgeschoss',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    //categories: []
                },
                yAxis: {
                    title: {
                        text: 'Temperatur & Luftfeuchtigkeit'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                            this.x +': '+ this.y;
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                series: []
            }

            $.getJSON("data2.php", function(json) {
                options.xAxis.categories = json[0]['data'];
                options.series[0] = json[1];
                options.series[1] = json[2];
                chart = new Highcharts.Chart(options);
            });
        });
        </script>

    </head>
    <body>
        <script src="js/highcharts.js"></script>
        <script src="js/modules/exporting.js"></script>
        <script type="text/javascript" src="js/themes/gray.js"></script>
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
</html>

我可能对数据格式(浮点数、整数...)或值中的点有问题?

非常感谢您的帮助

4

1 回答 1

0

问题确实是您的 JSON 对象包含数据的 String 值而不是 Float 值:

{ ... "data":["40.20","40.40","40.50", ... ]}

我不知道您数据库中的字段类型是什么,而且我不是 PHP 编码员,但您可以尝试将JSON_NUMERIC_CHECK选项设置为json_encode.

如果这对您不起作用,您还可以使用parseFloatJavascript 转换字符串:

for (var i = 0, num; num = json[1].data[i]; i++)
{
  json[1].data[i] = parseFloat(num);
}

请参阅我在 Fiddle 上的示例

于 2013-04-27T09:26:55.230 回答