echarts环形图配置

echarts环形图配置_第1张图片
我们想实现一个类似这样的环形图,需要配置大致如下:

let options = {
            legend: {
                show: false // 是否显示图例
            },
            title: {
                text: 2444, //主标题
                subtext: `上月值${titleObj.subtextValue}` // 副标题,
                left: 'center', // 水平对齐方式
                bottom: 0,
                itemGap: 4, // 主副标题相隔间距
                textStyle: { // 主标题样式
                    fontSize: 16,
                    fontWeight: 400
                }
            },
            series: { // 数据
                name: 'Access From',
                type: 'pie',
                radius: ['40%', '60%'], // 环比 圈的大小
                center: ['50%', '40%'], // 图形在整个canvas中的位置
                color: ['#ddd', '#566de8'], // item的取色盘
                avoidLabelOverlap: false,
                itemStyle: {
                    borderColor: '#fff', // 白边
                    borderWidth: 2
                },
                emphasis: { // 高亮item的样式
                    disabled: true
                },
                label: {
                    show:true,
                    position: 'center',
                    formatter: '货量' // 可以自定义,也可以{a}{b}{c}这种
                },
                labelLine: {
                    show: false
                },
                data: seriesData // 每个item的数据值,数组类型
            }
        }

你可能感兴趣的:(echarts,echarts,前端,javascript)