在类似于Changing cursor to pointer on Chart.js bar chart when hover (mousemove) event is disabled?的情况下,我尝试在悬停时改变光标。然而,在我的情况下,它是在饼图的分区上,而不是标签上。我们在点击每个分区时导航到相关的页面。
对于版本2,我们执行了以下操作:
options: {
hover: {
onHover: function(ev, el) {
ev.target.style.cursor = el[0] ? 'pointer' : 'default';
}
}
}
不过,这在v3中已经不起作用了。原生元素似乎不可用。我已经在事件的可用数据中搜索过了,但找不到实际的元素。
以下是我最近的尝试:
options: {
onHover: function(e) {
e.native.target.style.cursor = 'pointer';
}
}
我也尝试过通过activeEls
:
options: {
onHover: function(e, activeEls) {
if (activeEls.length) {
activeEls[0].style.cursor = 'pointer';
}
}
}
数据如下所示:
如何访问段元素以应用样式?
2条答案
按热度按时间zlhcx6iw1#
您可以从事件中获取图表示例,该事件具有可将鼠标定位到其上的画布,如下所示:
第一个
wydwbb8l2#
对于使用ChartJS 4的用户,如果遇到此问题,则无法像以前的版本一样找到元素。从3.x版本开始,您可以直接访问
onHover
中的chart
对象。options.onClick和options.onHover现在接收图表示例作为第三个参数
迁移指南3.x
要将光标更改为指针,可以执行如下操作:
应该可以