Question

我有一个d3图表，希望将鼠标坐标从另一个图表发送到该图表，

我在目标图表上远程触发了鼠标事件。到那为止一切都很好。问题是在下面的代码中获取了鼠标坐标。

$chart.on('mousemove', function () {
         var mouse = d3.mouse(this);

鼠标值始终为NaN。我怀疑是因为鼠标在另一个容器上。有没有办法在这里获取这些鼠标值？

Answer 1

所以这个想法实际上是“如何从另一个容器触发一个容器的事件”。

容器-触发器

创建自定义jquery函数-jquery效果很好，因为它是选择html元素的最简单方法。

$.fn.triggerSVGEvent = function(eventName, extraParameter) {
           var event = document.createEvent('SVGEvents');
           event.initEvent(eventName, true, true);
           event.extraParameter = extraParameter;  //this can be extended how you like
           this[0].dispatchEvent(event);
           return $(this);
         };

然后从您要触发事件的地方

var $el = $('#chart-two');
$el.triggerSVGEvent('mousemove', mouse); 
//I am sending out mouse coordinates as that was my main challenge.

容器-接收器

var $ el = $（'＃chart-two'）; $ el.on（'mousemove'，function（）{ var mouse = d3.event.extraParameter; }

非常感谢@thatOneGuy

将鼠标坐标发送到d3图表

1 个答案: