echarts自适应父div大小

百度了n种办法，试了n种办法后终于测出来了。

方法一：window.οnresize=myChart.resize; 但是没有效果

方法二：

window.addEventListener("resize", function () {

myChart.resize();

});

依旧没有效果

方法三：

<div class="summary"><div id="annual" ></div>
</div>$('.summary').resize(function () {var annual = echarts.init(document.getElementById("annual"));annual.resize();
});

依旧没有效果。

最后：百度到jquery有resize()事件，但直接调用没有起作用，引入jquery.ba-resize.js文件就可以了。经过试验，终于ok了

query有resize()事件，但直接调用没有起作用，必须引入jquery.ba-resize.js文件。

下载位置：https://download.csdn.net/download/weixin_38383877/10727216

例如：


<div class="chart"><div class="col-md-3" style="width:73%;height:270px" id="chartx"></div>
</div>
<script src="/static/assets/scripts/jquery.ba-resize.js"></script>
js代码：
var myChartx = echarts.init(document.getElementById('chartx'));
$('.chart').resize(function(){myChartx.resize();});

参考自：https://blog.csdn.net/yf814359680/article/details/71404654

echarts自适应父div大小相关推荐

e-charts折线图自适应外层div大小
问题描述: 在tabs页签下使用e-charts折线图,切换tab页签e-charts折线图无法自适应外层div大小: 解决方案: 添加监听器监听浏览窗口变化,两种监听方法 window.addEve ...
图片自适应父元素大小，并左右上下居中的css方法
图片自适应父元素大小,并左右上下居中的css方法前言这种效果多见于矩形盒子里面调用不规则的图片,希望能够达到的效果.这个效果可以很简单的用css来实现,虽然已经烂熟于心,但是并未记录下来.今天看到 ...
C#Winform 实现控件自适应父容器大小
C#Winform 实现控件自适应父容器大小在日常开发中经常遇到控件不能随着父容器大小的改变而且自动改变控件的所在位置和大小.以下是实现的代码 /// <summary>/// 根据父容 ...
用纯CSS让子DIV自适应父DIV的高度
我们在前端布局时经常使用栅格布局,而当栅格布局中的某个子元素高度发生变化,外层的父元素高度也会发生变化,如果此时想让其他子元素的高度依旧填充父元素,我们应该怎么做. 这是HTML部分代码,此时左侧的高 ...
VUE中echart自适应外部div大小
父组件:(因为要做动画效果,父组件要放大且居中,最开始时为了自适应全部都是用的是百分比) html: <div ref="testDiv" class="recta ...
textarea 自适应父容器大小
使用bootstrap中的form-control类 <textarea id="progress_message" rows="10" class=&q ...
[echarts] 图表自适应宽高大小
<div class="echart-wrap" :ref="wrapId" :id="wrapId" ><div :re ...
echarts基于父盒子达成自适应布局（大数据可视化页面必须！）
echarts基于父盒子达成自适应布局(大数据可视化页面必须!) 创建一个最外层容器内部嵌套echarts容器 <div class="container"> < ...
vue中echarts自适应屏幕大小
vue中echarts自适应屏幕大小,延迟执行项目中出现echarts适应屏幕大小,有时会遇到不管屏幕大小如何变化echarts图表大小不变的情况:或者出现图表变化延迟的情况,针对这两种情况,分别解 ...

echarts自适应父div大小

echarts自适应父div大小相关推荐

最新文章

热门文章