echarts圆环占比图

实际占整个饼图的比例情况

let myEcharts = this.$echarts.init(this.$refs.oneCircle)
let color = ['#474642' ,'#dabc96'];

    let echartData = [{
            value: 422
        },
        {
            value: 315
            // value: this.unitsNumber
        }
    ];

    let formatNumber = function(num) {
        let reg = /(?=(\B)(\d{3})+$)/g;
        return num.toString().replace(reg, ',');
    }
    let total = echartData.reduce((a, b) => {
        return b.value + '/'+422
    }, 0);

      let option={
         color: color,
        title: [{
            text: '{val|' + formatNumber(total) + '}',
            top: 'center',
            left: 'center',
            textStyle: {
                rich: {
                    // name: {
                    //     fontSize: 14,
                    //     fontWeight: 'normal',
                    //     color: '#00ff00',
                    //     padding: [10, 0]
                    // },
                    val: {
                        fontSize: 36,
                        fontWeight: 'bold',
                        color: '#dabc96',
                    }
                }
            }
        }],
        series: [{
            type: 'pie',
            // radius: ['50%', '70%'], //控制圆环大小
            radius: ['86%', '100%'],
            // center: ['50%', '50%'],	//控制圆环位置
            data: echartData,
            hoverAnimation: false,
            itemStyle: {
                normal: {

                    borderWidth: 2
                }
            },
            labelLine: {
                normal: {
                    length: 0,
                    length2: 0,
                    lineStyle: {
                        color: '#e6e6e6'
                    }
                }
            }
            // ,
            // label: {
            //     normal: {
            //         formatter: params => {
            //             return (
            //                 '{icon|●}{name|' + params.name + '}{value|' +
            //                 formatNumber(params.value) + '}'
            //             );
            //         },
            //         padding: [0 , -100, 25, -100],
            //         rich: {
            //             icon: {
            //                 fontSize: 16
            //             },
            //             name: {
            //                 fontSize: 14,
            //                 padding: [0, 10, 0, 4],
            //                 color: '#666666'
            //             },
            //             value: {
            //                 fontSize: 18,
            //                 fontWeight: 'bold',
            //                 color: '#333333'
            //             }
            //         }
            //     }
            // },
        }]
      }
      myEcharts.setOption(option)