[pie]半圆南丁格尔图

项目种需要使用饼图，但是样式稍微有点不一样，在此记录echarts画南丁格尔玫瑰图

option = {
  legend: {
    top: 'top'
  },
  toolbox: {
    show: false
  },
  series: [
    {
      name: 'Nightingale Chart',
      type: 'pie',
      radius: ['20%', '70%'],
      center: ['50%', '50%'],
      // 设置角度
      startAngle: 180,
      roseType: 'area',
      hoverAnimation: false,
      itemStyle: {
        borderRadius: 0
      },
      labelLine: {
        normal: {
          show: false
        }
      },
      label: {
        show: false
      },
      data: [
        { value: 40, name: 'rose 1' },
        { value: 38, name: 'rose 2' },
        { value: 32, name: 'rose 3' },
        { value: 30, name: 'rose 4' },
        { value: 28, name: 'rose 5' },
        // 最重要的是下面这里
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } }
      ],
      z: -1,
    },
    {
      name: 'Nightingale Chart',
      type: 'pie',
      radius: ['20%', '68%'],
      center: ['50%', '50%'],
      // 设置角度
      startAngle: 180,
      roseType: 'area',
      hoverAnimation: false,
      itemStyle: {
        borderRadius: 0
      },
      labelLine: {
        normal: {
          show: false
        }
      },
      label: {
        show: false
      },
      data: [
        { value: 40, itemStyle: { color: 'rgba(255,255,255,0.68)' } },
        { value: 38, itemStyle: { color: 'rgba(255,255,255,0.68)' } },
        {
          value: 32,
          name: 'rose 3',
          itemStyle: { color: 'rgba(255,255,255,0.68)' }
        },
        {
          value: 30,
          name: 'rose 4',
          itemStyle: { color: 'rgba(255,255,255,0.68)' }
        },
        {
          value: 28,
          name: 'rose 5',
          itemStyle: { color: 'rgba(255,255,255,0.68)' }
        },
        // 最重要的是下面这里
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } },
        { value: 0, itemStyle: { normal: { color: 'rgba(0,0,0,0)' } } }
      ]
    }
  ]
};

image.png