我试图在一个圆环图切片上发生onclick事件时创建一个链接。我的数据源是3个数组，其中有标签、值和url的id。
于飞：

<canvas id="pie-chart" style='display: none;'></canvas>

<!-- Php Arrays to JS -> PIE-CHARTDATA -->

<script type="text/javascript"> 

var chartIds = [[12,14,17,18]];

var chartValues = [[208.09,296.86,634.975,972.808]];

var chartLabels = [["BTC","AAPL","MSFT","ETH"]];

</script>

JS：

if (chartValues.length != 0 ) {
    document.getElementById("pie-chart").style.display= "block";
}
Chart.register(ChartDataLabels);

var chartValuesInt = [];
length = chartValues[0].length;
for (var i = 0; i < length; i++)
chartValuesInt.push(parseInt(chartValues[0][i]));

var data = [{
    data: chartValuesInt,
        chartIds,
    backgroundColor: [  
        "#f38000",
        "#5f44f5",
        "#333333",

    ],
    borderColor: "#000"
}];

var options = {
    borderWidth: 4,
    hoverOffset: 6,
    plugins: {
        legend: {
            display: false
        },
        tooltip: {
            enabled: false,

        },
        datalabels: {
            formatter: (value, ctx) => {
                let sum = 0;
                let dataArr = ctx.chart.data.datasets[0].data;

                dataArr.map(data => {
                    sum += data;
                });
                let percentage = (value*100 / sum).toFixed(2)+"%";

                return [ctx.chart.data.labels[ctx.dataIndex],
                percentage,   
                '$' + value ] ;
            },
            textAlign: 'center',
            color: '#fff',
            borderRadius: 50,
            padding:10,
            labels: {
                title: {
                    font: {
                        weight: 'bold',
                        size: '16px'
                    }
                },
            }  
        }
    },
    options:{
        onClick: (e, activeEls) => {
            let datasetIndex = activeEls[0].datasetIndex;
            let dataIndex = activeEls[0].index;
            let datasetLabel = e.chart.data.datasets[datasetIndex].label;
            let value = e.chart.data.datasets[datasetIndex].data[dataIndex];
            console.log("In click", datasetLabel,  value);
            //link to url with:[chartIds]
          }
    }
};

//IMAGE CENTER
const image = new Image();
image.src = 'img/pie-home2.png';

const plugin = {
  id: 'custom_canvas_background_image',
  beforeDraw: (chart) => {
    if (image.complete) {
      const ctx = chart.ctx;
      const {top, left, width, height} = chart.chartArea;
      const x = left + width / 2 - image.width / 2;
      const y = top + height / 2 - image.height / 2;
      ctx.drawImage(image, x, y);
    } else {
      image.onload = () => chart.draw();
    }
  }
};

var ctx = document.getElementById("pie-chart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'doughnut',
    data: {
        labels: chartLabels[0],
        datasets: data,
        chartIds
    },
    options: options,
    plugins: [plugin],
});

为什么onclick不起作用？
如何从发生事件的切片中获取具有正确索引的ID？
我已经搜索过了，但找不到这两个问题的答案。