ECharts3 IE8渲染新数据时不在原位置渲染
本文介绍了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>
解决方案
IE8奇怪的bug..
先清空掉容器内容就好了
这篇关于ECharts3 IE8渲染新数据时不在原位置渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
