使用jquery调用json数组中的空白页highchart

我有一个php页面（array.php）。在浏览器上，array.php生成ff结果

[{"name":"London","data2":["70","19"]},{"name":"Tokyo","data2":["60","18"]}]

array.php页面

<?php
//header("Content-type: text/json");
header("Content-type: application/json");


$db = mysql_connect("localhost", "username", "userpasswd"); 
mysql_select_db("weather",$db);
$query = "SELECT * FROM measures";

$result = mysql_query($query,$db);

while($row = mysql_fetch_array($result))
{
$h = $row["humidity"];
$w = $row["windspeed"];
$t = $row["temperature"];
$c = $row["city"];
$ar1[] = array("name" =>$c,"data2"=>[$h,$t]);
}
echo json_encode($ar1);

?>

那么警报功能就不起作用了。我觉得它无法识别变量（图表）。我以前申报过

$(document).ready(function() { 

所以它将是一个全局变量，但似乎不是这样

---

求你了，我真的需要帮助。我已经为此工作了好几天，但没有成功。我将不胜感激。提前感谢-Emma看起来像是您试图在创建数据之前将数据推送到图表中。 您将图表声明为NULL，是的，但是当图表变量不知道它是什么时，它如何知道应该将数据推送到它？ 页面执行的顺序似乎是：

申报表

通过ajax获取数据

将数据推送到图表

将图表声明为Highcharts。图表

为什么不从ajax调用中获取数据，然后在

$（document）.ready（function（）{

中调用数据图表的推送。这样，操作顺序是：

通过ajax获取数据

将图表声明为Highcharts。图表

将数据推送到图表

---

你真的需要进行Ajax调用吗？你不能在php页面处理过程中推送数据吗？我没有看到你对图表进行任何循环或实时更新，你只是尝试在加载时加载数据，而不是Ajax，我建议直接使用php

就您的问题而言，yes图表在您尝试访问它时没有实例化。我试图重现您的问题@以下是我的发现

调用Highchart的构造函数时会调用

requestData

方法。因此？这意味着构造函数调用尚未完成，因此对象（

chart

）尚未实例化。Highchart还支持将回调方法作为其构造函数的第二个参数，在构造后调用该参数（但仍然来自构造函数，只是您的图表现在已经在内部准备好了，但是构造函数调用还没有返回给它的调用者）作为

chart=new Highcharts.chart（{…}，requestData）

但同样的问题仍然存在。奇怪吗？不太奇怪，requestData方法是以图表对象作为上下文调用的，这意味着尽管不能使用

chart

变量引用“图表”，但可以使用

this

访问它，因为

chart

是requestData的调用方

不幸的是，您的问题现在刚刚达到下一个级别，但图表仍然不会显示数据，因为现在的新错误是，您的json格式不正确

[{“name”：“London”，“data2”：[“70”，“19”]}，{“name”：“Tokyo”，“data2”：[“60”，“18”]}]

，数字不应该在引号内，而是

[{“name”：“London”，“data2”：[70,19]}，{“name”：“Tokyo”，“data2”：[60,18]}]

在将值传递给json_encode之前，您需要将值转换为数字。在修复此问题后，几乎没有遇到其他错误。此外，您实际上不应该将序列推送到

chart.series

对象，而是使用

chart.addSeries（…）

@

更多的摆弄和调试让我想到了这个解决方案

编辑 您的方法的另一种替代方法可以是，如前面提到的@wergeld，首先进行Ajax调用，然后创建调用成功的图表，如下所示。fiddle@

---

感谢您的建议，但我认为chart=new Highcharts.chart（{非常感谢您的建议@wergeld，但我认为chart=new Highcharts.chart（{在$（文档）.ready（函数（）中）{.所以，我想知道我该怎么做。如果你不介意的话，你可以编辑我的代码。感谢你在document ready函数中声明图表和ajax调用。为了确保在ajax调用中得到整数而不是字符串，我将array.php代码中的一行从[link]$ar1[]=array（“name”=>c，“data2”=>[$h，$t]）；到$ar1[]=array（“name”=>$c，“data2”=>[（int）$h，（int）$t]）；我希望这对某些人非常有用，因为HIGHCHARTS在他们的文档中没有提供这样一个php/jquery完整的示例。所有这一切都归功于两位贡献者。太完美了！再次感谢Jugal Thakkar和wergeld。在将int传递给json_enc之前，我已经使用了您的第二个代码并将int解析为我的db数据ode.我现在想看看如何添加类别。我不知道该如何感谢你。我能说的就是：给你的胳膊肘添点油。好吧，最简单的感谢方式是投票给我们的答案，并将其中一个标记为正确。很高兴我们能帮上忙

//chart.xAxis.categories.push(series_name); or //chart.series.data.push(item.data2);

$(document).ready(function() { 

 function requestData() {
 chart=this;
 $.ajax({
url: 'array.php',
success: function(point) {
    $.each(point, function(i,item){
    var series_name = item.name;
    var series_data = item.data2;
    var series = {data: item.data2,name:series_name};
    chart.addSeries(series);
});


},
cache: false
});
  }

 var chart=null;
$(function() {
   requestData();
});

function requestData() {
     $.ajax({
    url: 'array.php',
     success: function(point) {
      var chartSeriesData=[];
         $.each(point, function(i,item){
         var series_name = item.name;
         var series_data = item.data2;     
         var series = {data: item.data2,name:series_name};
        chartSeriesData.push(series);
        });
     chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'column'      ,      

    },
    title: {
        text: 'Real time data from database'
    },
    xAxis: {
            categories: []
        },
    yAxis: {
        minPadding: 0.2,
        maxPadding: 0.2,
        title: {
            text: 'Value',
            margin: 80
        }
    },
    series: chartSeriesData
});         
},
cache: false
});
  }

}