ECharts3 IE8渲染新数据时不在原位置渲染
1.ECharts3 IE8渲染新数据时不在原位置渲染,如图
2.
出现的BUG:
想要的效果:
3.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.nj_zb{height:270px;}
</style>
<!--ECharts 3-->
<script src="echarts.common.min.js"></script>
<script>
// echarts绘画饼图
function xrzh02(id,datas){
var zh02_labels = new Array();
var zh02_values = new Array();
for(var key in datas){
zh02_labels.push(key);
zh02_values.push({value:datas[key][0],name:key,itemStyle:{normal:{color:datas[key][3]}}});
}
//渲染表格(想看明白请看ECharts 3.0官方api)
var zh02_Chart = echarts.init(document.getElementById(id));
zh02_option = {
tooltip : {
trigger: 'item',
formatter: "{b} <br/>{a} : {d}%"
},
legend: {
x : 'center',
y : 'bottom',
data:zh02_labels
},
calculable : true,
series : [
{
name:'占比',
type:'pie',
radius : [30, 110],
center : ['50%', '50%'],
roseType : 'area',
label:{normal:{formatter:"{b}\n{c}%",textStyle:{fontSize:16},show:true}},
data:zh02_values
}
]
};
// 使用刚指定的配置项和数据显示图表。
zh02_Chart.setOption(zh02_option);
}
</script>
</head>
<body>
<div style="width:400px">
<div class="nj_zb" id="notAvalon"></div>
<button onclick="CMY.change()">点击我切换另一组数据</button>
</div>
<script>
window.onload=function(){
var Rows={
"高一":[30],
"高二":[5]
};
xrzh02("notAvalon",Rows);
};
//点击我切换另一组数据
var CMY={};
CMY.change=function(){
var Rows2={
"高一":[7],
"高二":[8]
};
xrzh02("notAvalon",Rows2);
};
</script>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
IE8奇怪的bug..
先清空掉容器内容就好了