Highcharts不能从php json加载，但可以从data加载.json文件

Highcharts Won't load from php json, but it could load from data.json file

本文关键字：加载 json data 文件 但可以 Highcharts 不能 php      更新时间：2023-09-26

我尝试从JSON数据制作高图。我制作了一个php文件，生成json并将地址插入getJSON()，像这样。

$(document).ready(function() {
    $.getJSON("data.php", function(json) {
        chart = new Highcharts.Chart({
            chart: {...

，它不能工作，所以我决定把PHP放在highcharts文件中，像这样。

<?php
$mysqli = new mysqli("localhost", "root", "", "test");
$resu = array();
$measurement = $_POST["choosenmeasurement"];
for($i = 0; $i < count($_POST["choosenbusid"]); $i++)
{
$busid = $_POST["choosenbusid"][$i];
$clusid = $_POST["choosenclusterid"][$i];
$fieldname = ''.$measurement.'_BUSID_'.$busid.'_CLUSTERID_'.$clusid;
$sql= "SELECT unix_timestamp, $measurement as $fieldname FROM `get` WHERE bus_id = $busid and cluster_id = $clusid";
$sth = $mysqli->query($sql);
$out = array();
$out['name'] = $fieldname;
while ($rr = $sth->fetch_assoc()) {
$out['data'][] = $rr[$fieldname];
}
array_push($resu,$out);
}
$jsonresult = json_encode($resu);

?>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Highcharts Example</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(function () {
    var chart;
    $(document).ready(function() {
    $.getJSON(<?php $jsonresult>, function(json) {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            title: {
                text: 'testchart',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            yAxis: {
                title: {
                    text: ''
                },
                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: json
        });
        });
    });
    });
    </script>
    </head>
    <body>
    <script src="http://code.highcharts.com/highcharts.js"></script>
    <script src="http://code.highcharts.com/modules/exporting.js"></script>
    <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
    </html>

，它也不会加载，我尝试了很多方法，如把$jsonresult到javascript变量，回显json，打印json，打印/echo到getJSON()，仍然不会工作，即使如果我回显json到一个空白的空间，它会打印一个json结构，我想要的。

,

如果我像这样将JSON文件放入getJSON() 

$(document).ready(function() {
    $.getJSON("test.json", function(json)

它将工作。但是我不会在每次加载图表时将生成的json复制粘贴到json文件中。

我想知道为什么。任何帮助吗?

我也在做同样的事情所以在javascript部分你必须包括这个:

var json = "<?php echo $pepito; ?>";
datar = JSON.parse(json);

这样就有了javascript

中php的数据

同样重要的是传递数组中的数据和时间戳格式乘以1000。例如:

    $timestamp=strtotime($fila[0].$fila[1])*1000;
    //echo "'n".$timestamp;
$hola[0][]=array(   $timestamp, (float)$fila[2]);//RGD
$hola[1][]=array(   $timestamp, (float)$fila[3]);//RGA

你必须在你的脚本之前包含库，不确定这是否重要，但你应该改变它，以防万一:

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>

如果您有任何问题或需要更多信息，请告诉我。

相关文章：