### **my-dialog 调用方式**
```Vue
<template>
  <div>
    echart示例
    <el-tabs v-model="tabName">
      <el-tab-pane label="饼图" name="first" :lazy="true">
        <my-echarts
          :chart-config="chartConfigPie"
          @chartClick="chartClick"
        ></my-echarts>
      </el-tab-pane>
      <el-tab-pane label="柱状图" name="second" :lazy="true">
        <my-echarts
          :chart-config="chartConfigBar"
          @chartClick="chartClick"
        ></my-echarts>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import MyEcharts from "@/packages/echarts/src/my-echarts.vue";
export default {
  name: "ehcarts",
  components: {
    MyEcharts
  },
  data() {
    return {
      tabName: "first",
      chartConfigPie: {
        id: "echart1",
        divHieght: "450px",
        click: true,
        tooltip: {
          trigger: "item"
        },
        color: [
          "#33BCCA",
          "#4A9EF2",
          "#9D6BD8",
          "#F77C3A",
          "#f2f608",
          "#17f608",
          "#08f6f6",
          "#0830f6"
        ],
        toolbox: {
          show: true,
          feature: {
            saveAsImage: {
              type: "jpg",
              title: "下载"
            }
          }
        },
        label: {
          fontSize: 12,
          position: "outside",
          align: "left",
          formatter: function(params) {
            console.log("params", params);
            let num = "";
            if (parseInt(params.data.status) === 1) {
              num = params.data.amount + "元";
            } else {
              num = params.data.num + "份";
            }

            return params.name + params.percent + "%\n" + num;
          }
        },
        series: [
          {
            // name: "访问来源",
            type: "pie",
            radius: "50%",
            data: [
              { value: 0, name: "付款", status: 0, num: 0, amount: 0 },
              { value: 0, name: "收款", status: 0, num: 0, amount: 0 },
              { value: 0, name: "不涉及资金", status: 0, num: 0, amount: 0 },
              { value: 0, name: "其他", status: 0, num: 0, amount: 0 }
            ]
          }
        ]
      },
      chartConfigBar: {
        id: "echart2",
        divHieght: "450px",
        click: true,
        xAxis: {
          type: "category",
          data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
        },
        yAxis: {
          type: "value"
        },
        series: [
          {
            data: [120, 200, 150, 80, 70, 110, 130],
            type: "bar",
            showBackground: true,
            backgroundStyle: {
              color: "rgba(180, 180, 180, 0.2)"
            }
          }
        ]
      }
    };
  },
  methods: {
    chartClick(res) {
      console.log(res);
    }
  }
};
</script>

```

### **Attributes**

属性|说明|类型|默认值
:-|:-|:-|:-
chartConfig|图表配置项|Object

### **chartConfig**
chartConfig除了可以传入任意echarts官网的配置项属性，还能传入以下属性
属性|说明|类型|默认值
:-|:-|:-|:-
id|图表的id，每个图表必需要有一个唯一id|String
divWidth|图表组件的宽度|String|100%
divHieght|图表组件的高度|String|500px
divPadding|图表组件的padding|String|0px
divMargin|图表组件的margin|String|0px
click|是有启用点击事件|Boolean|false
### **event**
事件名|说明|
:-|:-
chartClick|图表点击事件，返回echart默认点击事件的参数和图表id