2
回答
echarts 一页多图表自适应
科大讯飞通用文字识别100000次/天免费使用。立即申请   
使用window.onresize = myChart.resize(),加载页面图表后,页面上只有一个图表会根据浏览器的变化而自适应。如果要是页面上的图表都要自适应,怎么办呢?
举报
sszc
发帖于3年前 2回/2K+阅
共有2个答案 最后回答: 3年前

     一个图表对应一个myChart对象,你要所有图表只适应,就需要监听所有图表的div变化,然后调 用resize()方法。

     我的解决方法是:对每个图表div监听变化(百度有监听方法),传入div与当前图表myChart对象,div变化,调用myChart.resize()   

    

    function addDivResizeListener(div, chart) {
         $(div).resize(function() {
         chart.resize();
    });
}

--- 共有 2 条评论 ---
laz用到是echarts单文件加载模式,echarts是一个全局对象 3年前 回复
sszc你那个循环中的echarts是哪里来的? 3年前 回复

引用来自“深渊魔皇”的评论

     一个图表对应一个myChart对象,你要所有图表只适应,就需要监听所有图表的div变化,然后调 用resize()方法。

     我的解决方法是:对每个图表div监听变化(百度有监听方法),传入div与当前图表myChart对象,div变化,调用myChart.resize()   

    

    function addDivResizeListener(div, chart) {
         $(div).resize(function() {
         chart.resize();
    });
}

我是将所有图片的myChart变成全局的,然后调用 

window.addEventListener("resize", function () {
    myChart1.resize(); 
    myChart2.resize()
    myChart3.resize()
    myChart4.resize()
    myChart5.resize()
    myChart6.resize()
    myChart7.resize(); 
 });


顶部