如果一个页面有一个图表:
myChart.setOption(option,window.onresize = myChart.resize);
如果一个页面有多个图表(此处举例3个):
shopsInfo.setOption(shopsInfos);
vendor.setOption(vendors);
company.setOption(companys);
在最后加上如下代码
//图表根据窗口大小自适应
setTimeout(function (){
window.onresize = function () {
shopsInfo.resize();
vendor.resize();
company.resize();
}
})
你好
ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。
当页面只有一个图表的时候直接用 window.onresize = myChart.resize 就可以了。
var myChart = echarts.init(document.getElementById('main'));但是如果一个页面有多个图表的时候就需要用到addEventListener了,不然页面上只有一个图表会根据浏览器的变化而自适应。
具体实现代码请参照: