echarts自適應父div大小
阿新 • • 發佈:2018-11-04
百度了n種辦法,試了n種辦法後終於測出來了。
方法一:window.onresize=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