在echarts中,若設置固定高度,當柱狀圖數據過多時會出現數據相互擠壓,給用戶的體驗十分糟糕,可以通過給容器設置自適應高度,然后通過getDom()的方法解決此問題。
具體解決辦法如下:
<div id="myChart1" :style="{width:'650px'}" class="chart-css" ref="myEchart1"></div>
let myChart = this.$echarts.init(document.getElementById("myChart1"));
this.autoHeight = this.counts * 55 + 50; // this.counts為柱狀圖的條數,即數據長度。
myChart.getDom().style.height = this.autoHeight + "px";
myChart.resize();
通過以上代碼即可解決echarts里面高度自適應問題。