plugins: [
{
id: 'Label images',
afterDraw: (chart) => {
for (const i in chart.scales.r._pointLabelItems) {
const point = chart.scales.r._pointLabelItems[i];
var image = new Image();
image.src = labelImages[i];
// you I had 20x20 images thats why I use 20x20
chart.ctx.drawImage(image, point.x - 10, point.y, 20, 20);
}
}
}
]
options: {
// just so that the images are not outside the canvas
layout: {
padding: 20
},
scales: {
y: {
display: false
},
x: {
display: false
},
r: {
pointLabels: {
// Hides the labels around the radar chart but leaves them in the tooltip
callback: function (label, index) {
return ' ';
}
}
}
}
}
1条答案
按热度按时间cgh8pdjw1#
我遇到了和你一样的问题,找到了这个解决方案:
定义要作为标签的base64图像数组
然后使用插件:
Draw image from context options
这个解决方案在标签所在的地方绘制图像(我认为是从标签开始的地方),如果你只想要图像而不想要文本,那么你应该隐藏标签。我是这样做的:
我希望这对你有帮助