eharts图标组件？

Question

<template>
 <div ref='chart' class='my-echart '></div>
</template>
<script>
import * as echarts from 'echarts';
export default{
   name:'MyEchart'
   props:{
     optios:{
        type:Object,
        default:()=>null
       }
    },
  data(){
     return { chart:null}
   },
  mounted(){
  window.addEventListener("resize", () => {
      this.setChart();
    });
  },
beforeDestroy() {
    window.removeEventListener("resize", null);
  },
 watch:{
       options:{
           handler(val){
            if(!val) return;
            this.setChart(val)
        },
       deep:true,
       immediate: true
     }
 },
methods:{
  setChart(opt=this.options){
   if(!opt) return
  if(!this.chart) this.chartInit();
  this.chart.clear()
  this.chart.setOption(opt)
  this.chart.resize()
  }  
},
chartInit(){
   this.chart =echarts .init(this.$refs.chart) 
  }
}
</script>
<style scoped lang="scss">
.my-echart {
  width: 100%;
  height: 100%;
}
</style>

封装了一个echarts组件，项目中需要用到到时可以直接引入，传入配置对象就可以，
我这个实现了echarts随着屏幕适配。

看下大家你们工作中echarts还有什么功能，我记得点击echarts好像还有啥东西来着，大家帮忙你们遇到的，一些公共的，帮忙看下能否组件在新加点配置啥的，达到最优解，一个人的力量不够，需要大家你们平时做的需求，

前提：我这个只是大部分图表，像那种地图啥的用不了这个，不需要考虑那种哈！！！！！