echarts-半圆

```

var myData = [{
    name: '一班',
    value: 200,
    per: 0.2
}, {
    name: '二班',
    value: 300,
    per: 0.3
}, {
    name: '三班',
    value: 500,
    per: 0.5
}]
var myColor = ['#06cdff', '#00ff84', '#fef34f', 'rgba(0, 0, 0, 0)']
var myName = []
myData.forEach(item => {
    myName.push(item.name)
})
option = {
    title: {},
    legend: {
        orient: 'vertical',
        icon: 'circle',
        bottom: '30%',
        itemGap: 12,
        itemHeight: 10,
        itemWidth: 10,

        data: myName,
        formatter: function(name) {
            let target;
            for (let i = 0; i < myData.length; i++) {
                if (myData[i].name === name) {
                    target = myData[i].value
                }
            }
            let arr = '{a|' + name + '}' + '{b|' + target + '人}'

            return arr
        },
        textStyle: {
            padding: 0,
            rich: {
                a: {
                    fontSize: 30,
                    color: '#06cdff',
                    width: 80,

                },
                b: {
                    fontSize:30,
                  
                }
            }
        }
    },
    tooltip: {
        trigger: 'item',
        formatter: function(item) {
            if (item.name !== '') {
                return (parseFloat(item.data.per) * 100).toFixed(2) + '%'
            }
        },
        backgroundColor: '#235EAE',
        borderWidth: 1,
        borderColor: '#6C99FF',
        padding: [5, 5, 5, 5]
    },
    series: [{
        name: '',
        type: 'pie',
        radius: ['30%', '40%'],
        labelLine: false,
        hoverAnimation: false, //鼠标悬浮时不放大  
        silent: true, //悬浮时不高亮   
        startAngle: 180,
        center: ['50%', '50%'],
        data: [1, 1],
        color: ['#043d69', 'rgba(0, 0, 0, 0)'],
        markLine: {
            silent: true,
            symbol: 'none',
            data: [
                [{
                        name: '',
                        x: '22%',
                        y: '50%'
                    },
                    {
                        x: '78%',
                        y: '50%'
                    }
                ]
            ],
            label: {
                show: false
            },
            lineStyle: {
                color: '#043d69',
                type: 'solid',
                width: 2
            }
        }
    }, {
        name: '',
        type: 'pie',
        radius: ['70%', '100%'],
        labelLine: false,
        hoverAnimation: false, //鼠标悬浮时不放大  
        silent: true,
        startAngle: 180,
        center: ['50%', '50%'],
        data: [1, 1],
        color: ['rgba(4, 61, 105, 0.3)', 'rgba(0, 0, 0, 0)']
    }, {
        name: '',
        type: 'pie',
        radius: ['85%', '95%'],
        labelLine: false,
        center: ['50%', '50%'],
        clockwise: true, //逆时针  
        startAngle: 180,
        minAngle: 10,
        label: {
            show: false
        },
        hoverAnimation: false, //鼠标悬浮时不放大 
        data: [{
            value: myData[0].value,
            name: myData[0].name,
            per: myData[0].per
        }, {
            value: myData[1].value,
            name: myData[1].name,
            per: myData[1].per
        }, {
            value: myData[2].value,
            name: myData[2].name,
            per: myData[2].per
        }, {
            value: myData[0].value + myData[1].value + myData[2].value,
            itemStyle: {
                normal: {
                    label: {
                        show: false
                    },
                    labelLine: {
                        show: false
                    }
                }
            }
        }],
        color: myColor
    }]
};