echarts图表中，如何处理某几项数据值过小导致拥挤的情况？

Question

如下所示，我的数据，类别固定为10个，但当某几项数据过小，其中1、2项数据过大时，显示会产生问题
由于是手机端展示，外部div已经固定为

#ota{
            width: 15rem;
            height: 2rem;
            margin: 0 auto;
    }

//数据
var moni =[
        {name:"测试",value:'100'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        {name:"测试",value:'1'},
        ]
            
  //制定图表的配置项和数据
                    var option = {
                        title: {
                            text: '各渠道\n销量及占比',
                            top: 'middle',
                            left: 'center',
                            textStyle: {
                                color: '#ff4c4d',
                                fontSize: '10px',
                                fontWeight: 'bold'
                            }
                        },
                        tooltip: {
                            trigger: 'item',
                            formatter: '{b}{d}%<br/>{c}(元)'
                        },
                        series: [{
                            name: '各渠道销量及占比',
                            type: 'pie',
                            radius: ["40%", "60%"],
                            avoidLabelOverlap: true,
                            label: {
                                normal: {
                                    show: true,
                                    textStyle: {
                                        color: '#ff4c4d',
                                        fontSize: '.5rem'
                                    },
                                    lineStyle: {
                                        color: '#024193'
                                    },
                                    shadowOffsetX: 0,

                                }
                            },
                            labelLine:{
                                normal:{
                                }
                            },
                            data: moni,
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true,
                                        formatter: '{b}\n{d}%\n{c}(元)'
                                    },
                                    labelLine: {
                                        show: true
                                    }
                                }
                            }
                        }],
                        backgroundColor: '#ffffff',

                    };       
        

显示如图

//我感觉像这种情况是不是不再适合做饼状图的展示？或者我不应该把label显示在外面而是应该显示在中间？

Answer 1

通过调整起始角度，和最小角度解决了这个问题。

series: [{

...
    startAngle:180,
    minAngle:15
...

}]

效果如图