vue項目實現echarts圖表最大化顯示功能

由於echart工具欄沒有提供最大化功能，只好使用elementUI的el-dialog自己寫一個類似的功能，效果如下

貌似這個放大效果作用不大（-_-||）下面放代碼吧

• 結構部分

      <div class="picItem boxShardow">
        <div class="header">
          <span>功率曲線</span>
          <i class="el-icon-rank" @click="fullSc('功率曲線')" style=" font-size: 22px; float: right; margin: 11px 17px 0px 0px; transform: rotate(45deg); color:#777; cursor: pointer;"></i>
        </div>
        <div id="chart-part1" ref="powerChart" style="width:96%;height:300px;"></div>
      </div>

    <el-dialog :title='chartTitle' :visible.sync="dialogVisible" width="80%">
          <div id="chart-part" ref="fullChart" style="width:100%; height:420px;"></div>
    </el-dialog>

• 點擊事件

    fullSc(title){

    this.chartTitle = title
    this.dialogVisible = true
    this.$nextTick(() => {
           const chartFul = this.$refs.fullChart;


           if(chartFul){
             
           const fullChart = this.$echarts.init(
             document.getElementById("chart-part")
           );
           fullChart.clear();
           var optionFll = this.option
           fullChart.setOption(optionFll);
           window.addEventListener("resize", function() {
             fullChart.resize();
           });    
           }
    });



    },