多折线图,会出现折线图的实际值与Y轴数值不一致的情况;
-
解决方法很简单,删除series:[ ]里的stack属性即可。
-
删除series:[ ]里的stack属性后=》
ajax读取接口数据的简单实现
-
建立json文件替代直接在html文件写入数据
(复制原series:[ ]数据,新建INDEX.json文件)
[
{
"name": "Email",
"type": "line",
"data": [120, 580, 101, 134, 90, 230, 210]
},
{
"name": "Video Ads",
"type": "line",
"data": [150, 232, 201, 154, 190, 330, 410]
},
{
"name": "Search Engine",
"type": "line",
"data": [820, 132, 901, 934, 1290, 1330, 320]
}
]
清除series:[ ],建立xml对象
var xml = new XMLHttpRequest();
xml.open('GET',"http://127.0.0.1:8848/June22/pro/html/INDEX.json");
xml.send();
xml.onreadystatechange = function(){
if(xml.readyState==4){//服务请求结束
if(xml.status==200){
//照这个地址,200代表成功 http状态码 404
var obj =JSON.parse(xml.response);
//得到接口的值 并转成js对象
option3.series = obj;
echarts3.setOption(option3);
}
}
}
实现效果一样,此时单独在json文件里更改数据即会产生变化