echarts配置_echarts legend.borderradius-CSDN博客

本文链接：https://blog.csdn.net/JIME_Y/article/details/147480470
option = {
  
    legend: {
      show: false
    },
    tooltip: {
      show: true,
    },
     series: [
      {
        type: 'pie',
        radius: ['65%', '80%'],
        center: ['40%', '50%'],
        hoverAnimation: false,
        z: 10,
        label: {
          show:false
        },
        itemStyle: {
            borderRadius: 10, // 设置饼图块的圆角
           borderColor:'transparent',// 设置饼图块的边框颜色
            borderWidth: 3 // 设置饼图块的边框宽度
        },
        data: [
          {
            value: 30,
            name: '未成年',
            itemStyle: {
              color: 'rgba(62, 155, 255, 1)',
            
            },
          },
          {
            value: 30,
            name: '中年',
            itemStyle: {
              color: 'rgba(255, 196, 0, 1)',
             
            },
          },
          {
            value: 40,
            name: '青年',
            itemStyle: {
              color: 'rgba(108, 225, 114, 1)',
             
            },
          },
           {
            value: 40,
            name: '老年',
            itemStyle: {
              color: 'rgba(255, 0, 61, 1)',
              
            },
          },
        ],
        labelLine: {
          show: false,
        },
      },
        //阴影
      {
        type: 'pie',
        radius: ['58%', '78%'],
        center: ['40%', '50%'],
        hoverAnimation: false,
        label: {
          show: false,
        },
         itemStyle: {
            borderRadius: 10, // 设置饼图块的圆角
           borderColor:'transparent',// 设置饼图块的边框颜色
            borderWidth: 3 // 设置饼图块的边框宽度
        },
        data: [
          {
            value: 30,
            name: '未成年',
            itemStyle: {
              color: 'rgba(62, 155, 255, 1)',
              opacity:0.1
            },
          },
          {
            value: 30,
            name: '中年',
            itemStyle: {
              color: 'rgba(255, 196, 0, 1)',
              opacity:0.5
            },
          },
          {
            value: 40,
            name: '青年',
            itemStyle: {
              color: 'rgba(108, 225, 114, 1)',
              opacity:0.5
            },
          },
           {
            value: 40,
            name: '老年',
            itemStyle: {
              color: 'rgba(255, 0, 61, 1)',
              opacity:0.5
            },
          },
        ],
        labelLine: {
          show: false,
        },
      },
//最外层
      {
        type: 'pie',
        radius: ['81%', '82%'],
        center: ['40%', '50%'],
        hoverAnimation: false,
        label: {
          show: false,
        },
         itemStyle: {
            borderRadius: 10, // 设置饼图块的圆角
           borderColor:'transparent',// 设置饼图块的边框颜色
            borderWidth: 3 // 设置饼图块的边框宽度
        },
        data: [
          {
            value: 30,
            name: '未成年',
            itemStyle: {
              color: 'rgba(62, 155, 255, 1)',
            },
          },
          {
            value: 30,
            name: '中年',
            itemStyle: {
              color: 'rgba(255, 196, 0, 1)',
            },
          },
          {
            value: 40,
            name: '青年',
            itemStyle: {
              color: 'rgba(108, 225, 114, 1)',
            },
          },
           {
            value: 40,
            name: '老年',
            itemStyle: {
              color: 'rgba(255, 0, 61, 1)',
            },
          },
        ],
        labelLine: {
          show: false,
        },
      },
    ],
  
};
圆环大小需要通过radius来控制