是否可以将可点击的标记/图像添加到Chart.js图表​​？

Question

是否可以在Chart.js图表​​上添加如下图所示的可点击图像？

只有在单击与图像关联的点时才会显示图像。

请帮助，这可以通过某种方式完成吗？

编辑：

createChart(element, chartData) {
    const ChartObj = new Chart(element, {
        type: 'line',
        data: chartData,
        options: {
            responsive: false,
            onClick: this.handleClick,
            legend: {
                display: false
            },
            scales: {
                yAxes: [{
                    gridLines: {
                        display: false,
                    },
                    display: false
                }],
                xAxes: [{
                    gridLines: {
                        color: 'rgba(255, 255, 255, 1)',
                        zeroLineColor: 'rgba(255, 255, 255, 1)', // hide the zero line by making it white
                    },
                    ticks: {
                        // Only display time line with a 5 year span
                        callback: function(dataLabel, index) {
                            return (index+1) % 5 === 0 ? dataLabel : '';
                        }
                    }
                }],
            },
            tooltips: {
                mode: 'index',
                intersect: false,
                position: 'nearest',
                callbacks: {
                    label: function(tooltipItem, data) {
                        return data.datasets[tooltipItem.datasetIndex].label + ': ' + currencyFormatter.format(tooltipItem.yLabel, { code: 'SEK', thousand: ' ', precision: 0 });
                    },
                    title: function(tooltipItem, data) {
                        return data.labels[tooltipItem[0]['index']] + ' år';
                    }
                },
                custom: this.customTooltip
            },
            annotation: {
                annotations: [
                    {
                        type: 'line',
                        id: 'a-line-1',
                        mode: 'vertical',
                        scaleID: 'x-axis-0',
                        value: Moment().format('Y'),
                        borderColor: '#3a3a3a',
                        borderWidth: 1,
                    }
                ]
            }
        },
    });

    element.onmousemove = (e) => {
        const x = ChartObj.getElementsAtXAxis(e);
        const annotations = ChartObj.annotation.options.annotations;
        if (annotations.length) {
            for (let i = 0; i < annotations.length; i++) {
                if (annotations[i].id === 'a-line-1') {
                    ChartObj.annotation.options.annotations[i].value = chartData.labels[x[0]._index];
                }
            }
            ChartObj.update(0);
        }
    };

    return ChartObj;
}

我正在尝试使用图表对象的onClick选项。

要点击除20 x轴上的点以外的所有其他点，图像不应出现。如图所示。