我想通过getJSON方法将数据传递到highcharts:
<script type="text/javascript">
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);
});
}
</script>
</head>
<body>
<div >
<input type="text" id="datepicker1" name="date1" onchange='draw_chart()' >
</div>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
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); 。我该如何解决这个问题？谢谢。
最佳答案
您需要在 $.getJSON(); 的 success 回调中移动 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);
}
);
}
关于jquery - highcharts 通过 JSON 获取数据？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14658104/