首先確保當前環境(react echarts)就是兼容IE8版本的
// 統計圖表 示例
setTjtb() {
let barChart = echarts.init(this.refs['barChart']);
// 餅圖
barChart.setOption({
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
color: ['#F68D41', '#FACC14'],
legend: {
orient: 'vertical',
x: 'left',
data: []
},
toolbox: {
show: true,
},
series: [
{
name: '發票結存情況',
type: 'pie',
radius: ['50%', '70%'],
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
}
},
emphasis: {
label: {
textStyle: {
fontSize: '30',
fontWeight: 'bold'
}
}
}
},
data: [
{ value: 100, name: '已開份數' },
{ value: 200, name: '結存份數' }
]
}
]
});
this.setState({
myChart: barChart
})
}
// 展示統計圖表
showTjtbModal = () => {
let _this = this
setTimeout(function () {
_this.setTjtb();
_this.setTjtba();
_this.setTjtbb();
}, 30)
}
componentWillMount() {
this.showTjtbModal() //控制echarts圖表並把圖表的函數對象賦值的函數
}
componentDidMount() {
let _this = this
if (window.attachEvent) {//判斷是不是IE
window.onresize = function () {
_this.state.myChart.resize();
_this.state.myCharta.resize();
_this.state.myChartb.resize();
}
// window.attachEvent("onresize",_this.iegbck() );
} else if (window.addEventListener) {//如果非IE執行以下方法
window.addEventListener("resize", () => {
console.log('正在改變chrome')
this.state.myChart.resize();
this.state.myCharta.resize();
this.state.myChartb.resize();
});
}
}