如何使用chart.js在甜甜圈图表中添加图像？

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<canvas id="myChart"></canvas>

var ctx = document.getElementById('myChart').getContext('2d');

var data = {
  labels: ['Red', 'Blue', 'Yellow'],
  datasets: [{
    data: [10, 20, 30],
    backgroundColor: ['#ff6384', '#36a2eb', '#ffce56'],
    hoverBackgroundColor: ['#ff6384', '#36a2eb', '#ffce56'],
    // 添加图像
    images: [
      'https://example.com/image1.png',
      'https://example.com/image2.png',
      'https://example.com/image3.png'
    ]
  }]
};

var options = {
  // 配置选项
};

Chart.pluginService.register({
  beforeDraw: function(chart) {
    var width = chart.chart.width,
        height = chart.chart.height,
        ctx = chart.chart.ctx;

    // 绘制图像
    chart.data.datasets.forEach(function(dataset) {
      for (var i = 0; i < dataset.images.length; i++) {
        var img = new Image();
        img.src = dataset.images[i];
        ctx.drawImage(img, width / 2 - 25, height / 2 - 25, 50, 50);
      }
    });
  }
});

var myChart = new Chart(ctx, {
  type: 'doughnut',
  data: data,
  options: options
});