Javascript AMCHART4图形上方和下方的标签

我目前正试图用AMCHART4绘制一些漂亮的饼图

问题是我的数据集中有很多不同的小数据，这导致了很多标签。AmCharts4仅在我的PieChart上左右对齐标签，这导致某些标签不显示。我不想隐藏任何标签

我在谷歌上搜索，试图在amcharts文档中找到一些东西，但除了这个例子之外，我找不到任何有用的东西。这正是我所需要的，但它基于amcharts3，我想使用amcharts4，但我无法迁移该示例

以下是我使用AMCHART4尝试的代码：

am4core.ready=>{ //主题开始 AM4核心。使用热处理材料； am4core.useThemeam4themes\u动画； //主题结束 //创建图表实例 const chart=am4core.create'chartdiv'，am4charts.PieChart； //添加数据 //chart.data=this.portfolioSecurityData； chart.data=[ { 国家：'帐户状态'， 升：501.9， }, { 国家：'随机安全'， 升：301.9， }, { 国家：“IFTA”， 升：201.1， }, { 国家：'车辆登记'， 升：165.8， }, { 国家：'所有卡车在'， 升：139.9， }, { 国家：'串联重量'， 升：128.3， }, { 国家：'站点随机'， 升：99， }, { 国家：'没有懦夫'， 升：60， }, { 国家：“更多数据1”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, { 国家：“更多数据”， 升：50， }, ]; chart.exporting.menu=新建am4core.ExportMenu； //设置内半径 chart.innerRadius=am4core.percent50； chart.radius=AM4核心点80%； //添加和配置系列 const piesteries=chart.series.pushnew am4charts.piesteries； pieSeries.dataFields.value='L'； pieSeries.dataFields.category='country'； pieSeries.slices.template.stroke=am4core.color'fff'； pieSeries.slices.template.strokeWidth=2； pieSeries.slices.template.strokeOpacity=1； //这将创建初始动画 pieSeries.hiddenState.properties.opacity=1； pieSeries.hiddenState.properties.endAngle=-90； pieSeries.hiddenState.properties.startAngle=-90； pieSeries.labels.template.fontSize=12； 我观看了两张结果图片：

---

你有几个选择

选择1 减少标签的填充，使它们更紧密地包装在一起：

pieSeries.labels.template.padding(1, 1, 1, 1);

选择2 取消对齐标签，如V3：

pieSeries.alignLabels = false;

选择3 使用官方插件对小片段进行分组

var grouper = pieSeries.plugins.push(new am4plugins_sliceGrouper.SliceGrouper());
grouper.clickBehavior = "break";
grouper.threshold = 3;