Highcharts,$ .getJSON,没有运行图表

时间:2017-04-25 08:50:55

标签: php highcharts getjson

我尝试在一行高亮显示从php文件“highchartsFixData.php”传递的一些值,这给了我:

[{"name":"Month","data":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},{"name":"Umidita","data":[29.9,71.5,106.4,129.2,144,176,135.6,148.5,216.4,194.1,95.6,54.4]}]

我不知道这是否是传递数据数组的正确方法,或者下面的代码中有错误。

这是highchartsFixData.php

<?php   
$rows = array();
$rows['name'] = 'Month';
$rows1 = array();
$rows1['name'] = "Umidita"; 

$rows["data"] =  ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
$rows1["data"] = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];
$rst = array();

array_push($rst,$rows);
array_push($rst,$rows1);

print json_encode($rst, JSON_NUMERIC_CHECK);
?>

这是index.htm:

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

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

<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 option={
        chart: {
            renderTo: 'container',
            type: 'line',
            marginRight: 130,
            marginBottom: 25
        },
        title: {
            text: 'Highcharts Test',
            x: -20 //center
        },
        subtitle: {
                text: '',
                x: -20
        }
        xAxis: {
            categories: []
        },
        yAxis: {
            title: {
                text: 'Umidita'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },

        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: -10,
            y: 100,
            borderWidth: 0
        },
        series: json

}

    $.getJSON("highchartsFixData.php", function(json) {

    options.xAxis.categories = json[0]['data'];
    options.series[0] = json[1]['data'];
    chart = new Highcharts.Chart(options);          
    });

}); 

</script> 
</head>
<body>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto">
</div>
</body>
</html>
</pre>

index.html没有显示图表,我不知道如何解决它.. 请帮我.. 感谢

0 个答案:

没有答案