Javascript 如何在用Chart.js制作的甜甜圈图表中写入数据标签？

我正在用chart.js制作一个甜甜圈图表，我想把标签写在图表的每个部分中，我甚至尝试过使用CharPieceLabel插件，但到目前为止我还无法渲染它。我分享代码，我真的很感谢你的帮助

下面是HTML代码：

<div class="grafica col-sm-6 col-sm-12 col-md-6">
      <canvas id="chartJSContainerB"></canvas>
</div>

var optionsb = {
              type: 'doughnut',
              data :{
                labels: ["Alfabetización", "Traducción"],
                datasets: [{
                  data: [40,60],
                  backgroundColor:[blue, orange],
                },
                
              
              ],
                
              },
              options:{
              plugins: {
                  labels: {
                    render:'label',
                    fontStyle:'normal',
                    fontSize: 12,
                    fontColor: '#fff',
                    fontFamily: 'Arial',
                    arc:true,
                  },
                  legend: {
                    display:false, 
                    
                    },
                  datalabels: {
                    backgroundColor: function(context) {
                      return context.dataset.backgroundColor;
                    },
                    color: 'white',
                    font: {
                      weight: 'bold',
                      size:18
                    },
                    padding: 4,
                  }
                }
            }
            }
            // custom render
           
            var ctxb = document.getElementById('chartJSContainerB').getContext('2d');
            new Chart(ctxb, optionsb);

var选项B={
键入：“甜甜圈”，
数据：{
标签：[“Alfabetización”、“Traducción”]，
数据集：[{
数据：[40,60]，
背景颜色：[蓝色，橙色]，
},
],
},
选项：{
插件：{
标签：{
渲染：'label'，
fontStyle:“正常”，
尺寸：12，
fontColor:“#fff”，
fontFamily：“Arial”，
是的，
},
图例：{
显示：假，
},
数据标签：{
背景颜色：功能（上下文）{
返回context.dataset.backgroundColor；
},
颜色：'白色'，
字体：{
重量：'粗体'，
尺码：18
},
填充：4，
}
}
}
}
//自定义渲染
var ctxb=document.getElementById（'chartJSContainerB'）.getContext（'2d'）；
新图表（ctxb、选项B）；

您几乎就要实现它了，但您需要注册

ChartDataLabels

并使用“格式化程序”作为功能显示标签，并按如下操作显示标签：

Chart.register（ChartDataLabels）；
var chartInstance=新图表（document.getElementById（“chartJSContainer”）{
键入：“甜甜圈”，
数据：{
标签：[“Alfabetización”、“Traducción”]，
数据集：[{
数据：[40,60]，
背景颜色：[“蓝色”、“橙色”]，
}, ],
},
选项：{
插件：{
标签：{
渲染：“标签”，
fontStyle:'正常'，
尺寸：12，
fontColor:“#fff”，
fontFamily：“Arial”，
是的，
},
图例：{
显示：假，
},
数据标签：{
格式化程序：函数（值、上下文）{
返回context.chart.data.labels[context.dataIndex]；
},
颜色：'白色'，
字体：{
重量：'粗体'，
尺码：18
},
填充：4，
}
}
}
});

对不起，我已经有了Chart.register（ChartDataLabels）；在代码中，很抱歉没有显示它，即使它不起作用，它也不会在图形的扇区内显示标签，但在我给出的上述示例中，标签在图表内是可见的？这是不对的吗？谢谢你，朋友，但我想展示标签，没有价值。我已经在我的答案和代码片段中做了更改，请参考它并让我知道它是否正确。不确定是否可以将其显示为圆弧，但您可以将文本旋转为完成