HighCharts和PHP json_encode。来自MySQL的数据。图表上没有数据

时间:2016-04-25 18:13:46

标签: javascript php mysql json highcharts

尝试使用MySQL中的数据生成HighCharts。使用PHP和json_encode函数从MySQL解析数据。问题:图表上没有数据。

这是我的javascript:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">

</style>
<script type="text/javascript">

$(document).ready(function() {

    var options = {
        chart: {
            renderTo: 'container',
            type: 'spline'
        },
        series: [{}]
    };

    $.getJSON('json.php', function(data) {
        options.series[0].data = data;
        var chart = new Highcharts.Chart(options);
    });

});

</script>

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

</head>
<body>

<div id="container" style="max-width: 500px; height: 400px; margin: 0 auto"></div>

</body>
</html>

这是我的json.php:

<?php

$host = "localhost:3306";
$user = "removed";
$pass = "removed";
$dbname = "removed";

$connection = mysqli_connect($host, $user, $pass, $dbname); 

$query = "SELECT temp, time from vejr where time > '2016-04-25 06:14:23'";

$result = mysqli_query($connection, $query);

$emparray = array();
    while($row =mysqli_fetch_assoc($result))
    {
        $emparray[] = $row;
    }
        echo json_encode($emparray);

?>

这是json.php的输出:

[{&#34; temp&#34;:&#34; 1.6&#34;,&#34; time&#34;:&#34; 2016-04-25 08:14:23&#34; },{&#34; temp&#34;:&#34; 2.6&#34;,&#34; time&#34;:&#34; 2016-04-25 09:14:23&#34;}, {&#34; temp&#34;:&#34; 3.6&#34;,&#34; time&#34;:&#34; 2016-04-25 10:14:23&#34;},{& #34; temp&#34;:&#34; 4.6&#34;,&#34; time&#34;:&#34; 2016-04-25 11:14:23&#34;},{&#34 ; temp&#34;:&#34; 5.6&#34;,&#34; time&#34;:&#34; 2016-04-25 12:14:23&#34;},{&#34; temp& #34;:&#34; 6.6&#34;,&#34;时间&#34;:&#34; 2016-04-25 13:14:23&#34;},{&#34; temp&#34 ;:&#34; 7.6&#34;,&#34;时间&#34;:&#34; 2016-04-25 14:14:23&#34;},{&#34; temp&#34;: &#34; 8.6&#34;,&#34;时间&#34;:&#34; 2016-04-25 15:14:23&#34;}]

我想要做的是x轴上带有时间的图表(fx 2016-04-25 08:14:23),以及y轴上的值(fx 1.6)。 / p>

从中获得灵感:http://www.highcharts.com/docs/working-with-data/custom-preprocessing#3

而且,我知道我在x轴上的时间戳并不完美,它很长(2016-04-25 08:14:23),但这就是我的喂食软件目前发送给我的MySQL 。什么是完美的?

亲切的问候

1 个答案:

答案 0 :(得分:2)

问题是由3个原因引起的。

  1. 值应命名为x和y,而不是自定义字段
  2. y值应为数字,而不是您拥有的字符串(使用json_encode中的JSON_NUMERIC_CHECK标志)
  3. x值应为时间戳(以毫秒为单位的时间)。在PHP中,您可以使用strtotime()函数