所以我知道如何在我的弧上附加一个mouseEnter事件,好吧...
<g
key={`arc-${name}-${i}`}
onMouseEnter={selectArc}
>
<path d={pie.path(arc) as string} fill={arcFill}/>
</g>
但是在那之后,我不知道如何处理我过去在经典d3js中使用的所有函数。
我想要实现的是https://plnkr.co/edit/GLyA70V4X7xqhg06mgMF?p=preview&preview
在d3中,它们会执行类似以下的操作(请参见上面的链接以获取演示和完整代码):
.on("mousemove", function(d) {
d3.select(this).transition().duration(200).delay(0).attrTween("d", function(d) {
var i = d3.interpolate(d.outerRadius, outerRadius);
return function(t) { d.outerRadius = i(t); return arc(d); };
});
...
})
但如何使用visx实现这一点呢?
1条答案
按热度按时间v440hwme1#
我希望你正在寻找一些visx的例子与鼠标移动动画。我设法创建了一个演示使用visx。我附上代码沙箱链接如下。
https://codesandbox.io/s/sad-pare-4432ke
让我知道你的反馈。谢谢