1==>tooltip 类似饰hover框组件。光标放上去会触发

2==>formatter   // 饼图 {a}（系列），{b}（数据项），{c}（数值）,{d}（百分比）

3==>itemStyle 饼图各个部分之间隔

4==>legend通常是是解释说明每部分的

如果将echarts封装成了组件，那么你需要注意的事，
数据可能时有的，但是echarts图像没有出来，这个问题怎么：
原因：当进行dom渲染的时候，数据还没有回来。因为没有
办法：在watch中去初始化的，数据数据变化的时候，就去，
这样就不会出现excharts不出来了这个现象
    watch: {
        mydata() {
            this.initEcharts();
            console.log(1);
        }
    },

<template>
    <div>
        <div id="demo"></div>
    </div>
</template>

 mounted() {
        this.initEcharts();
},methods: {
        initEcharts() {
            let demo = echarts.init(document.getElementById("demo"))
            var option = {

                // 类似饰hover框组件。
                // tooltip: {
                //     trigger: 'item',//     formatter: '{a} <br/>{b}: {c} ({d}%)'
                // },// 类似解释说名，
                // legend: {
                //     orient: 'vertical',//     left: 10,//     data: ['直接访问','营销','联盟广告','视频广告','引擎']
                // },series: [
                    {
                        type: 'pie',radius: ['50%','70%'],avoidLabelOverlap: false,label: {
                            show: false,position: 'center',},emphasis: {
                            label: {
                                show: true,fontSize: '30',fontWeight: 'bold',formatter: '{b} {d}%',//中间百分比
                                // 饼图 {a}（系列），{b}（数据项），{c}（数值）,{d}（百分比）
                            }
                        },labelLine: {
                            show: false
                        },//饼图每个板块之间有间隔
                        itemStyle: {
                            borderWidth: 2,//设置border的宽度有多大
                            borderColor: '#fff',//间隙颜色
                        },data: [
                            { value: 10,name: '直接访问' },{ value: 20,name: '营销' },{ value: 30,name: '联盟广告' },{ value: 40,name: '视频广告' },{ value: 100,name: '引擎' }
                        ]
                    }
                ]
            };
            demo.setOption(option);

        }

    }
}

<style lang="scss" scoped>
#demo {
    width: 400px;
    height: 400px;
}
</style>