highcharts通过JSON获取数据？

我想通过getJSON方法将数据传递给highcharts：

 var chart; $(document).ready(function(){ $("#datepicker1").datepicker({showOn: 'button', buttonImage: 'css/base/images /calendar.gif', buttonImageOnly: true,dateFormat: "yy-mm-dd"}); }); function draw_chart(){` var url="http://localhost/handle_data.php?start=2012-12-30&end=2013-01-04"; chart=new Highcharts.Chart({}); $.getJSON(url,function(data1){ var options={ chart: { renderTo: 'container', type: 'line' }, xAxis:{ type: 'datetime' }, yAxis: { title: { text: 'test' } }, series:[{ data:data1.result[0].dayactivity, name: "name" }] }; var chart = new Highcharts.Chart(options); }); }    
  
 
 

data1.result[0].dayactivity的值是：

 [[1356796800,0.0],[1356883200,16.1],[1356969600,0.0],[1357056000,0.0],[1357142400,15.0]], 

当我把这个值直接放到options.series[0].data ，它可以工作，但是当我通过getJSON传递它时，它没有。 图表是空的。 它似乎执行var chart = new Highcharts.Chart(options); 第一。 我怎么解决这个问题？ 谢谢。

Answer 1

您需要在$.getJSON();的success回调中移动Chart的创建$.getJSON(); 您只需要实例化并创建一次Chart ，这将在回调函数中。

 function draw_chart() { var url="http://localhost/handle_data.php?start=2012-12-30&end=2013-01-04"; $.getJSON(url, function(data1){ /** Declare options after success callback. */ var options={ chart: { renderTo: 'container', type: 'line' }, xAxis:{ type: 'datetime' }, yAxis: { title: { text: 'test'} }, series:[{ data:data1.result[0].dayactivity, name: "name" }] }; /** Create a chart instance and pass options. */ var chart = new Highcharts.Chart(options); } ); } 

Answer 2

你初始化highcharts，在获取数据之前，这是固定的脚本，我注释了更改的行。

 var chart; $(document).ready(function () { $("#datepicker1").datepicker({ showOn: 'button', buttonImage: 'css/base/images /calendar.gif', buttonImageOnly: true, dateFormat: "yy-mm-dd" }); }); function draw_chart() { var url = "http://localhost/handle_data.php?start=2012-12-30&end=2013-01-04"; // chart = new Highcharts.Chart({}); //PROBLEM ONE - empty initialisation $.getJSON(url, function (data1) { var options = { chart: { renderTo: 'container', type: 'line' }, xAxis: { type: 'datetime' }, yAxis: { title: { text: 'test' } }, series: [{ data: data1.result[0].dayactivity, name: "name" }] }; //var chart = new Highcharts.Chart(options); // removed var here, as it looks you want it to be global chart = new Highcharts.Chart(options); }); } draw_chart(); 

没有json的演示 ，但你可以看到问题