//单个图形自适应
//第一种写法
window.onresize = myChart.resize;
//第二种写法
window.onresize = function() {
myChart.resize()
}
//多个图形自适应
//第一种写法
window.addEventListener('resize', function () {
myChartA.resize();
myChartB.resize();
myChartC.resize();
})
//第二种写法
window.onresize = function(){
myChartA.resize();
myChartB.resize();
myChartC.resize();
}
但是当myChart命名一样时不能用第二种写法
例如:
function FunChart1(data)
{
var myChart = echarts.init(document.getElementById('myChart1'));
myChart.setOption({
...
});
//随屏幕自适应
window.addEventListener('resize', function () {
myChart.resize()
})
}
function FunChart2(data)
{
var myChart = echarts.init(document.getElementById('myChart2'));
myChart.setOption({
...
});
//都被命名为myChart
window.addEventListener('resize', function () {
myChart.resize()
})
}
//ECharts图形数据更新图表重新绘制
//第一种写法加上true
myChart.setOption({...},true)
//第二种写法
var option = {...}
myChart.setOption(option, true);
ECharts自适应与重绘
最新推荐文章于 2024-08-30 11:23:31 发布
本文介绍了ECharts图形如何实现窗口大小变化时的自适应调整,包括两种不同的事件监听写法,并展示了在处理多个图表时的注意事项。同时,探讨了ECharts图形数据更新时的重绘方法,包括直接调用`setOption`函数和传入`true`参数的两种方式,确保图表根据新数据正确更新。
摘要由CSDN通过智能技术生成