四分之三为百分百数据效果

 www(){
            var myChar = this.$echarts.init(this.$refs.wwwww);
            var data = [{
                name: "景区",
                value: 29.1
            },
            {
                name: "酒店",
                value: 13.7
            },
            {
                name: "乡村",
                value: 8.2
            },
            {
                name: "餐饮",
                value: 6.8
            }
            ];
            var arrName = getArrayValue(data, "name");
            var arrValue = getArrayValue(data, "value");
            var sumValue = eval(arrValue.join('+'));
            var objData = array2obj(data, "name");
            var optionData = getData(data);
            function getArrayValue(array, key) {
                var key = key || "value";
                var res = [];
                if (array) {
                    array.forEach(function (t) {
                        res.push(t[key]);
                    });
                }
                return res;
            }

            function array2obj(array, key) {
                var resObj = {};
                for (var i = 0; i < array.length; i++) {
                    resObj[array[i][key]] = array[i];
                }
                return resObj;
            }

            function getData(data) {
                var res = {
                    series: [],
                    yAxis: []
                };
                for (let i = 0; i < data.length; i++) {
                    res.series.push({
                        name: '景点',
                        type: 'pie',
                        clockWise: false, //顺时加载
                        hoverAnimation: false, //鼠标移入变大
                        radius: [65 - i * 15 + '%', 57 - i * 15 + '%'],
                        center: ["40%", "55%"],
                        label: {
                            show: false
                        },
                        itemStyle: {
                            label: {
                                show: false,
                            },
                            labelLine: {
                                show: false
                            },
                            borderWidth: 5,
                        },
                        data: [{
                            value: data[i].value,
                            name: data[i].name
                        }, {
                            value: sumValue - data[i].value,
                            name: '',
                            itemStyle: {
                                color: "rgba(0,0,0,0)",
                                borderWidth: 0
                            },
                            tooltip: {
                                show: false
                            },
                            hoverAnimation: false
                        }]
                    });
                    res.series.push({
                        name: '',
                        type: 'pie',
                        silent: true,
                        z: 1,
                        clockWise: false, //顺时加载
                        hoverAnimation: false, //鼠标移入变大
                        radius: [65 - i * 15 + '%', 57 - i * 15 + '%'],
                        center: ["40%", "55%"],
                        label: {
                            show: false
                        },
                        itemStyle: {
                            label: {
                                show: false,
                            },
                            labelLine: {
                                show: false
                            },
                            borderWidth: 5,
                        },
                        data: [{
                            value: 7.5,
                            itemStyle: {
                                color: "rgba(42,58,111,0.5)",   //默认圆的颜色
                                borderWidth: 0
                            },
                            tooltip: {
                                show: false
                            },
                            hoverAnimation: false
                        }, {
                            value: 2.5,
                            name: '',
                            itemStyle: {
                                color: "rgba(0,0,0,0)",
                                borderWidth: 0
                            },
                            tooltip: {
                                show: false
                            },
                            hoverAnimation: false
                        }]
                    });
                    res.yAxis.push((data[i].value / sumValue * 100).toFixed(2) + "%");
                }
                return res;
            }

            var option = {
                legend: {
                    show: true,
                    top: "10%",
                    left: '45%',
                    // icon: "circle",
                    data: arrName,
                    itemWidth: 14, 
                    itemHeight: 6,
                     50,
                    padding: [0, 1],
                    itemGap: 8,
                    formatter: function (name) {
                        return "{title|" + name + "}{value|" + (objData[name].value) + "万元}"
                    },
                    textStyle: {
                        rich: {
                            title: {
                                fontSize: 14,
                                lineHeight: 14,
                                color: "rgba(255,255,255,.85)"
                            },
                            value: {
                                fontSize: 14,
                                lineHeight: 18,
                                color: "rgba(255,255,255,.85)"
                            }
                        }
                    },
                },
                tooltip: {
                    show: true,
                    trigger: "item",
                    formatter: "{a}<br>{b}:{c}万元({d}%)"
                },
                color: ['#F40204', '#FF7E00', '#E5CE10', '#00A1E4'],
                grid: {
                    top: '20%',
                    bottom: '48%',
                    left: "50%",
                    right: '0%',
                    containLabel: false
                },
                yAxis: [{
                    type: 'category',
                    inverse: true,
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        interval: 0,
                        inside: true,
                        textStyle: {
                            color: "#fff",
                            fontSize: 10,
                        },
                        show: false
                    },
                    data: optionData.yAxis
                }],
                xAxis: [{
                    show: false
                }],
                series: optionData.series
            };
            myChar.setOption(option);
        }