Echarts中的饼图的某块由于数据太小导致占比太小，图形上几乎看不见问题的解决方案

数据过多,且几个比较小的数据在一块扎堆

 

 解决方案  在series中的一个对象中  添加属性  minAngle

 

源码1，元数据部分：

#其中的两个红色加粗的为数值非常小的，在饼图中根据数据占比会非常小，用肉眼几乎看不出来。
let echartData = {
    inner: [
        {
            value: 300,
            unit: '件',
            name: '第一检查部'
        },
        {
            value: 100,
            unit: '件',
            name: '第二检查部'
        },
        {
            value: 10,
            unit: '件',
            name: '第三检查部'
        },
        {
            value: 160,
            unit: '件',
            name: '第四检查部'
        },
        {
            value: 1,
            unit: '件',
            name: '第五检查部'
        }
    ],
    outer: [
        {
            value: 100,
            unit: '件',
            name: '第一检查部'
        },
        {
            value: 300,
            unit: '件',
            name: '第二检查部'
        },
        {
            value: 400,
            unit: '件',
            name: '第三检查部'
        },
        {
            value: 400,
            unit: '件',
            name: '第四检查部'
        },
        {
            value: 3,
            unit: '件',
            name: '第五检查部'
        }
    ]
}

　源码2：echart中的series部分

　

 series: [
         //最外层圆环
        
      
        {
            name: '外环',
            type: 'pie',
            minAngle: 10,  //设置扇形的最小占比
            radius: ['50%', '75%'],
            center: ["40%", "50%"],
            startAngle: '240',
            data: echartData.outer,
            labelLine: {
                normal: {
                    length: 20,
                    length2: 140,
                    lineStyle: {
                        color: '#e6e6e6'
                    }
                }
            },
            itemStyle: { // 此配置
                normal: {
                    borderWidth: 2,
                    borderColor: '#fff',
                },
                emphasis: {
                    borderWidth: 0,
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            },
            label: {
                normal: {
                    position: 'inner',
                    formatter: params => {
                        return (
                            params.value + '件'
                        );
                    },
                    fontSize: 22,
                    color: '#000',
                    // padding: [0, -130, 25, -130],
                }
            },
        },
        
        {
            name: '内环',
            type: 'pie',
             minAngle: 10,
            radius: ['25%', '50%'],
            center: ["40%", "50%"],
            itemStyle: { // 此配置
               normal: {
                    borderWidth: 2,
                    borderColor: '#fff',
                },
                emphasis: {
                    borderWidth: 0,
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            },
            label: {
                normal: {
                    position: 'inner',
                    formatter: params => {
                        return (
                            params.value + '件'
                        );
                    },
                    fontSize: 22,
                    color: '#000',
                }
            },
            labelLine: {
                normal: {
                    show: false
                }
            },
            startAngle: '230',
            data: echartData.inner
        }
    ]

　　

设置前

图中的箭头为所指向的两个占比，内环占比和外环占比

 

 

设置后

 

 所以说通过  

 minAngle   属性  设置度数，就可以直接设置一个最小的占比度数，可以防止扇形过小的问题