我利用php将数据库取到的数据转换为json数组,格式为{"temp":"6.0","time":"Monday 00:19:32 CST"},用ajax处理数据,然后我打开html文件,发现页面空白,连图表(引入了wonderland主题)都没有,难道是配置项错了?
配置项如下
<!DOCTYPE html>
<html style="height:100%">
<head>
<meta charset="utf-8">
<title>ECharts</title>
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script src="/home/www/echarts.js"></script>
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script src="/home/www/wonderland.js"></script>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('container'),'wonderland');
var arr1=[],arr2=[];
function arrTest(){
$.ajax({
type:"post",
async:false,
url:"http://lococalhost:8080/jsonarray.php",
data:{},
dataType:"json",
success:function(result){
if (result) {
for (var i = 0; i < result.length; i++) {
arr1.push(result[i].temp);
arr2.push(result[i].time);
}
}
}
})
return arr1,arr2;
}
arrTest();
var option = {
tooltip: {
show: true
},
legend: {
data:['temp']
},
xAxis : [
{
type : 'time',
data : arr2
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
"name":"temp",
"type":"line",
"data": arr1
}
]
};
// 为echarts对象加载数据
myChart.setOption(option);
// }
</script>
</body>
</html>