环形占比图

Echarts 效果图

image.png

Echarts 绘制环形占比图

闲话不多说,直接到观众老爷们最喜欢的上代码环节

js代码

环形概率图:
    data = [
    ['已拣配', 0.6]
    ]
    t1 = (data[0][1] * 100).toFixed(0)
    var option = {
        color: ['#78d5e5', '#01377d'],
        title: {
            text: data[0][0]
        },
        series: [{
            name: '来源',
            type: 'pie',
            radius: ['60%', '75%'],//环形图内外半径
            avoidLabelOverlap: true,
            hoverAnimation: false,
            label: {
                normal: {
                    show: false,
                    position: 'center',
                    textStyle: {
                        fontSize: 18,
                        fontWeight: 'bold'
                    },
                    formatter: '{c}%'
                }
            },
            data: [{
                    value: t1,
                    name: "",
                    label: {
                        normal: {
                            show: true
                        }
                    }
                },
                {
                    value: (1 - data[0][1]) * 100,
                    name: ''// 中心文字
                }
            ],
            clockwise: false
            // 是否逆时针
        }]
    }