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>