我在用 JSON 数据填充我的 highchart 时遇到问题。当我在网页中执行脚本时,数据将填充图表需要的特定区域,但是当我尝试使用 highcharts 时,什么也没有出现。
当我摆脱我的 php 并插入一个静态数字时,图表将自行创建。
总而言之,当我运行我的 php 脚本(但正在生成数据)以及插入静态数字并删除我的 php 脚本时,Highcharts 将无法运行。
$response = file_get_contents('https://graph.facebook.com/'.FACEBOOK_PAGE_ID.'/insights /page_views?access_token='.FACEBOOK_ACCESS_TOKEN);
$page = json_decode($response);
if ($page && $page->data) {
$test = $page->data[0]->values[2]->end_time; $newDate = date("d-m-Y", strtotime($test));
$gender = $page->data[0]->values[2]->value;
$test2 = $page->data[0]->values[1]->end_time; $newDate1 = date("d-m-Y", strtotime($test2));
$gender1 = $page->data[0]->values[1]->value;
$test3 = $page->data[0]->values[0]->end_time; $newDate2 = date("d-m-Y", strtotime($test3));
$gender2 = $page->data[0]->values[0]->value;
}
header('Content-Type: application/json');
?>
{
chart: {
renderTo: 'container',
height: 220,
type: 'column'
},
title: {
text: ''
},
xAxis: {
categories: ['apples'],
lineWidth: 0,
tickWidth: 0,
},
yAxis: {
min: 0,
title: {
text: ''
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
}
}
},
legend: {
align: 'left',
x: 0,
verticalAlign: 'left',
y: 15,
floating: true,
backgroundColor: 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' + this.series.name + ': ' + this.y + '<br/>' +
'Total: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: 'white'
}
}
},
series: [{
name: '<?php echo $newDate; ?> ',
data: [<?php echo $gender; ?>]
}, {
name: '<?php echo $newDate1; ?>',
data: [<?php echo $gender1; ?>]
}, {
name: '<?php echo $newDate2; ?>',
data: [<?php echo $gender2; ?>]
}]
});
});
});
这是我得到的输出。
{
chart: {
renderTo: 'container',
height: 220,
type: 'column'
},
title: {
text: ''
},
xAxis: {
categories: ['apples'],
lineWidth: 0,
tickWidth: 0,
},
yAxis: {
min: 0,
title: {
text: ''
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
}
}
},
legend: {
align: 'left',
x: 0,
verticalAlign: 'left',
y: 15,
floating: true,
backgroundColor: 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' + this.series.name + ': ' + this.y + '<br/>' +
'Total: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: 'white'
}
}
},
series: [{
name: '19-01-2013 ',
data: [57]
}, {
name: '18-01-2013',
data: [21]
}, {
name: '17-01-2013',
data: [34]
}]
});
});
});