饼图样式调整echarts 饼配置项内容和展示

让数据在扇形区域内显示,自定义扇形颜色,调整legend显示位置

配置项如下
      option = {
    backgroundColor:'',
    title: {
        text: '当前未处理预警',
        left: 'center',
        textStyle:{
          color:'#fff',   //修改标题颜色
        },
    },
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b} : {c} ({d}%)'
    },
    legend: {
        //orient: 'vertical',   //让ledend竖向排列
        left: 'center',
        top: 'bottom',
        textStyle:{
          color:'#fff',   //修改标识字体颜色
        },
        data: ['紧急', '主要', '次要', '提示']
    },
    color:['#fa55fe', '#9249f8','#a4f2fb','#3f7dfe'], //修改饼图颜色
    series: [
        {
            name: '访问来源',
            type: 'pie',
            radius: '80%',  //调整饼图大小
            avoidLabelOverlap: true,    //是否启用防止标签重叠策略
            center: ['50%', '50%'],  //调整饼图整体位置
                label:{
                normal: {
                    show:true,
                    position:'inner',      //显示在扇形上
                    formatter: ' {c} 个',  //显示内容
                    textStyle: {
                        color: 'white',    // 改变标示文字的颜色
                        fontSize: 14,  //文字大小
                        fontWeight: 'bold'
                    },
                },
            },
            data: [
                {value: 25, name: '紧急'},
                {value: 20, name: '主要'},
                {value: 15, name: '次要'},
                {value: 35, name: '提示'}
            ],
            emphasis: {
                itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ],

};

    
截图如下