来自highcharts的系列没有出现答案

【问题标题】：Series from highcharts not showing up来自highcharts的系列没有出现
【发布时间】：2015-07-14 11:59:27
【问题描述】：

这是我第一次使用 Highcharts，我正在为一个小问题而苦苦挣扎，这并没有让我在工作中走得更远。

我在 MySQL 中有一个数据库，我正在尝试使用 Highcharts 在图表上显示一些信息。

问题是，即使经过几次尝试，我仍然无法展示我的系列，我不明白为什么。

这是我的代码：

数据.php

<?php
try
{
    $bdd = new PDO('mysql:host=localhost;dbname=name', 'root', '');
}
catch (Exception $e)
{
        die('Erreur : ' . $e->getMessage());
}

$sql=<<<SQL
        SELECT DATE, Traf_BH_TCH_Erl, Trafic_HR_BH, Block_BH_TCH 
        FROM 182_d_all 
        WHERE BCF='TIMNAY'  
SQL;
$reponse = $bdd->query($sql);


$bln = array(); 
$rows = array();
$bln['name'] = 'Date';
$rows['name'] = 'Traf_BH_TCH_Erl';          

while($donnee=$reponse->fetch()){
    $bln['data'][] = $donnee['DATE'];
    $rows['data'][] = $donnee['Traf_BH_TCH_Erl']; 
    }
$rslt = array();
array_push($rslt, $bln);
array_push($rslt, $rows);
print json_encode($rslt, JSON_NUMERIC_CHECK);

$reponse->closeCursor(); 
?>

line.php

<?php
$cakeDescription = "Highcharts Pie Chart";
?>
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title><?php echo $cakeDescription ?></title>
        <link href="webroot/css/cake.generic.css" type="text/css" rel="stylesheet">
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                var options = {
                    chart: {
                        renderTo: 'container',
                        type: 'line'
                    },
                    title: {
                        text: 'Random title',
                        x: -20 //center
                    },
                    subtitle: {
                        text: 'Random subtitle',
                        x: -20
                    },
                    xAxis: {
                        categories: [],
                        title: {
                            text: 'Date'
                        }
                    },
                    yAxis: {
                        title: {
                            text: 'Traf_BH_TCH_Erl'
                        },
                        plotLines: [{
                                value: 0,
                                width: 1,
                                color: '#808080'
                            }]
                    },
                    tooltip: {
                        valueSuffix: 'Hz' 
                    },
                    legend: {
                        layout: 'vertical',
                        align: 'right',
                        verticalAlign: 'middle',
                        borderWidth: 0
                    },
                    series: []
                };
                $.getJSON("data.php", function(json) {
                    options.xAxis.categories = json[0]['data']; //xAxis: {categories: []}
                    options.series[0] = json[1];
                    chart = new Highcharts.Chart(options);
                });
            }); 

        </script>
        <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script>
    </head>
    <body>
       <!-- <a class="link_header" href="/highcharts/">&lt;&lt; Back to index</a> -->
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
</html>

问题是该系列的所有值都等于零。我不明白为什么它都是空白而不是显示值？

感谢您的回答！

编辑：

JSON 看起来像：

[{"名称":"日期","数据":["\n5/6/2015 00:00:00","\n17/6/2015 00:00:0","\n15/ 6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0 ","\n11/6/2015 00:00:0","\n26/6/2015 00:00:0","\n18/6/2015 00:00:0","\n18/6/ 2015 00:00:0","\n16/6/2015 00:00:0","\n7/6/2015 00:00:00","\n9/6/2015 00:00:00", "\n3/6/2015 00:00:00","\n11/6/2015 00:00:0","\n9/6/2015 00:00:00","\n11/6/2015 00 :00:0","\n20/6/2015 00:00:0","\n7/6/2015 00:00:00","\n24/6/2015 00:00:0","\ n9/6/2015 00:00:00","\n22/6/2015 00:00:0","\n26/6/2015 00:00:0","\n26/6/2015 00:00 :0","\n17/6/2015 00:00:0","\n17/6/2015 00:00:0","\n16/6/2015 00:00:0","\n16/ 6/2015 00:00:0","\n24/6/2015 00:00:0","\n22/6/2015 00:00:0","\n24/6/2015 00:00:0 ","\n22/6/2015 00:00:0","\n3/6/2015 00:00:00","\n20/6/2015 00:00:0","\n20/6/ 2015 00:00:0","\n3/6/2015 00:00:00","\n7/6/2015 00:00:00","\n28/6/2015 00:00:0", "\n25/6/2015 00:00:0","\n25/6/2015 00:00:0","\n25/6/2015 00:00:0","\n5/6/2015 00 :00:00","\n5/6/2015 00:00:00","\n28/6/2015 00:00:0","\n28 /6/2015 00:00:0","\n15/6/2015 00:00:0","\n15/6/2015 00:00:0","\n23/6/2015 00:00: 0","\n21/6/2015 00:00:0","\n19/6/2015 00:00:0","\n19/6/2015 00:00:0","\n19/6 /2015 00:00:0","\n30/6/2015 00:00:0","\n30/6/2015 00:00:0","\n28/5/2015 00:00:0" ,"\n18/6/2015 00:00:0","\n1/7/2015 00:00:00","\n1/7/2015 00:00:00","\n1/7/2015 00:00:00","\n8/6/2015 00:00:00","\n8/6/2015 00:00:00","\n8/6/2015 00:00:00"," \n4/6/2015 00:00:00","\n4/6/2015 00:00:00","\n4/6/2015 00:00:00","\n28/5/2015 00: 00:0","\n28/5/2015 00:00:0","\n29/5/2015 00:00:0","\n29/5/2015 00:00:0","\n29 /5/2015 00:00:0","\n31/5/2015 00:00:0","\n6/6/2015 00:00:00","\n6/6/2015 00:00: 00","\n6/6/2015 00:00:00","\n30/5/2015 00:00:0","\n30/5/2015 00:00:0","\n21/6 /2015 00:00:0","\n21/6/2015 00:00:0","\n10/6/2015 00:00:0","\n10/6/2015 00:00:0" ,"\n10/6/2015 00:00:0","\n23/6/2015 00:00:0","\n23/6/2015 00:00:0","\n29/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0"," \n27/6/2015 00:00:0","\n29/6/2015 00:00:0","\n29/6/2015 00 :00:0","\n27/6/2015 00:00:0","\n27/6/2015 00:00:0","\n30/5/2015 00:00:0","\ n30/6/2015 00:00:0","\n1/6/2015 00:00:00","\n1/6/2015 00:00:00","\n1/6/2015 00:00 :00","\n31/5/2015 00:00:0","\n31/5/2015 00:00:0","\n2/6/2015 00:00:00","\n2/ 6/2015 00:00:00","\n2/6/2015 00:00:00","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0 ","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/ 2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0","\n11/6/2015 00:00:0", "\n12/6/2015 00:00:0","\n12/6/2015 00:00:0","\n12/6/2015 00:00:0","\n12/6/2015 00 :00:0","\n12/6/2015 00:00:0","\n12/6/2015 00:00:0"]},{"name":"Traf_BH_TCH_Erl","data":[ "14,49","17,47","12,96","13,10","13,10","12,03","5,59","10,33","3 ,68","10,42","14,92","12,82","14,49","11,93","12,03","11,47","5,59 ","11,09","12,29","10,31","5,63","10,15","9,82","4,56","15,58", "8,52","12,77","7,56","10,18","11,23","3,36","4,08","11,96","9 ,97","3,98","5,69","4,97","13,49","8,55","7,88","4,17","12,25 ","5,81","8,69","4,72","12,01","5,59","11,58", "9,77","9,69","8,47","2,89","9,61","3,24","12,71","8,27","12 ,36","10,42","3,67","14,21","13,59","4,92","15,37","13,56","4,44 ","11,41","7,39","14,90","11,77","6,63","11,02","12,68","11,48", "5,19","12,37","5,84","8,26","3,87","12,71","11,79","5,37","8 ,94","3,27","9,82","13,10","12,03","5,59","11,31","9,06","3,65 ","10,13","4,06","9,11","9,79","11,71","11,57","5,46","9,37", "4,59","13,62","13,33","5,34","13,10","12,03","5,59","13,10","12 ,03","5,59","13,10","12,03","5,59","10,59","10,00","4,77","10,59 ","10,00","4,77"]}]

【问题讨论】：

查看数据库中的数据
感谢您的回答。我做了，数据是正确的。当我在本地主机上查看 data.php 时，我可以看到 JSON 格式的所有值
你能把你的 JSON 贴在这里吗？
@SebastianBochan ：是的，我在上面添加了它。
谢谢@SebastianBochan 现在它确实有效了！

标签： php json charts highcharts

【解决方案1】：

这里发生了很多事情......

为了从您的数据中获取功能示例，我做了一些更改：

您必须在“系列”中创建一个“数据”字段：
```
series: [{
    data: []
}]
```
您必须从“series[0]”设置“数据”属性并从您的 JSON 传递数据字段：
```
options.series[0].data = text[1].data; 
```
必须使用数字作为y坐标数据，所以应该使用点作为小数分隔符，不要使用引号：
```
{"name":"Traf_BH_TCH_Erl","data":[11.23,3.36,4.08,11.96,9.97]}
```
您没有正确使用日期格式的 X 轴，但您可以在您的第一个 Highcharts 工作后进行搜索。 ;)

功能示例：JSFiddle

【讨论】：

感谢您的解释！
不客气。如果您仍然有问题，请随时告诉我们。如果您的问题得到解决，您应该考虑接受这个答案 (meta.stackexchange.com/questions/5234/…)。