echarts图表的自适应

自适应：当浏览器的大小发生变化的时候，想让图表也能随之适配变化。

（1）监听窗口大小变化事件（调用echarts组件时，多个echarts图表的自适应问题）

      window.addEventListener("resize", () => {
        myEcharts.resize();
      });

（2）在事件处理函数中调用Echarts实例对象的resize即可

　　window.onresize=function(){

             myCharts.resize();
        }

　　或者： window.onresize = myCharts.resize

　　<script src="lib/echarts.min.js"></script>

　　 <div id="main" style="height:400px;border:1px solid black"></div>
    <script type="text/javascript">
        var myCharts = echarts.init(document.getElementById('main'));
        var xDataArr = ['张三', '李四', '王五', '闰土', '小明', '茅台', '二妞', '大强']
        var yDataArr = [88, 92, 63, 77, 94, 80, 72, 86]
        var option = {
            xAxis: {
                type: 'category',
                data: xDataArr
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                type: 'bar',
                data: yDataArr

            }]
        }
        myCharts.setOption(option);
        // // 监听window窗口大小变化的事件
        // window.onresize=function(){
        //     // 调用echarts实例对象的resize方法
        //     myCharts.resize();
        // }
        window.onresize = myCharts.resize
    </script>