[英]Chartjs disable color change on hover withouth disabling tooltips
I have been trying to disable all color changes when hovering on a chart canvas but I still have not been able to remove all the color changes without disabling all tooltips and other interactions on the chart.当悬停在图表 canvas 上时,我一直在尝试禁用所有颜色更改,但如果不禁用图表上的所有工具提示和其他交互,我仍然无法删除所有颜色更改。 The code I use to set the colors is:
我用来设置 colors 的代码是:
const color = array.map(a => getRandomColorWithAlphaOf(0.7))
const dataTest = {
labels: turns,
datasets: array.map((a,i) => (
{
label: a.nick,
fill: false,
data: a.data.map(d => d.cost),
borderColor: color[i],
backgroundColor: color[i],
hoverBackgroundColor: color[i],
hoverBorderColor: color[i],
pointBackgroundColor: color[i],
pointBorderColor: color[i],
pointHoverBackgroundColor: color[i],
pointHoverBorderColor: color[i]
}
))
}
Still when hovering on the points it changes the colors.仍然当悬停在点上时,它会更改 colors。
Chart creation code is here:图表创建代码在这里:
const lineChart = new Chart (ctx, {
type: "line",
data: dataTest,
options: {
legend: {
display: false
},
legendCallback: (chart) => {
var text = [];
text.push('<ul>');
for (var i=0; i <chart.data.datasets.length; i++) {
console.log(chart.data.datasets[i]);
text.push('<li>');
text.push('<span style="background-color:' + chart.data.datasets[i].borderColor + '">' +" " +'</span>');
text.push('<span">' + chart.data.datasets[i].label + '</span>');
text.push('</li>');
}
text.push('</ul>');
return text.join("");
}
}
})
Is there a way to get rid of all color changes without using something like "event: []" that would disable tooltips at the same time?有没有办法摆脱所有颜色变化而不使用像“事件:[]”这样会同时禁用工具提示的东西?
EDIT: moving color generation inside useEffect fixed the problem.编辑:在 useEffect 中移动颜色生成解决了这个问题。 I guess it generated colors multiple different times.
我猜它生成了 colors 多次不同的时间。
Solved it with moving color generation inside useEffect.在 useEffect 中通过移动颜色生成解决了这个问题。 I guess it generated colors multiple different times.
我猜它生成了 colors 多次不同的时间。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.