echarts容器高度根据数据数量自适应
echarts容器高度根据数据数量自适应
在echarts中,需要设置固定高度,当柱状图数据过多时会出现数据相互挤压,给用户的体验十分糟糕,可以通过给容器设置自适应高度,然后通过getDom()的方法解决此问题。
<div id="chart1" style="width: 90%; min-height:400px;"></div>
//省略其他。。
myChart.setOption(option);
//解决高度不能自适应问题,counst.length为柱状图的条数,即数据长度。
var autoHeight = yAxisList.length * 50 + 50;
myChart.getDom().style.height = autoHeight + "px";
myChart.resize();
参考文档:
https://www.echartsjs.com/zh/api.html#echartsInstance.getDom
https://www.520mwx.com/view/24331
-------------已经触及底线 感谢您的阅读-------------