ECharts单个,多个图表自适应宽度,以及自定义文字自适应
日常开发的时候遇到一个需求,图表需要根据div的宽度自适应
并且文字也需要根据窗口大小来设置left
可以用到官方文档的 == resize() 方法 ==
单个图表
const dom = document.getElementById('pie-district') as HTMLDivElement;
const myChart = echarts.init(dom);
let setOptionData = {} // 假设一堆配置
myChart.setOption(setOptionData);
// 在setOption之后
window.onresize = myChart.resize();
多个图表
window.addEventListener('resize', () => {
myChart1.resize();
myChart2.resize();
myChart3.resize();
});
自定义文字自适应
在 myChart.setOption();传入的对象设置left 的百分比就行
legend:{
let: '50%'
}