百度echart resize的坑

需求：根据数据量的大小，动态调整echart柱形图的宽度。

实现构想：根据数据的size调整div的大小，然后调用echart对象的resize方法重置柱状图的宽度：

                // 图的大小动态自动调整
                let compactWidth = data.size*32;
                let width = compactWidth < 1860 ? 1860 : compactWidth;
                this.chartStyle.width = width + "px";
                vueVisit.visitChart.resize();

碰到的问题：柱状图并没有动态的改变了宽度，而是下次再调整一次才生效。

原因分析：应该是echart渲染或者读取div的宽度什么的延迟了。。。

解决方法：延时100毫秒再调用echart对象的resize方法：

                // 图的大小动态自动调整
                let compactWidth = data.size*32;
                let width = compactWidth < 1860 ? 1860 : compactWidth;
                this.chartStyle.width = width + "px";
                setTimeout(function(){
                    vueVisit.visitChart.resize();
                }, 100); //需要一个延迟，resize()才能生效