Javascript 是否可以使用非鼠标、非触摸事件与D3.js图形交互?如果是,最有效的方法是什么?

Javascript 是否可以使用非鼠标、非触摸事件与D3.js图形交互?如果是,最有效的方法是什么?,javascript,d3.js,leap-motion,Javascript,D3.js,Leap Motion,我使用的不是鼠标,而是跳跃运动。它是一种运动感应设备,允许使用手指、手和手势,而不是鼠标 我有一个代码,可以绘制用户手指与屏幕相交的点,因此用户的手指在网页上用蓝色圆圈表示,与此代码相同: 我在网页上还有一个力定向图,与这个例子相同:bl.ocks.org/mbostock/4062045 我想允许用户在手指与蓝色圆圈相交时拖动节点 我可以让点击模拟代码工作,但当我尝试使用X和Y位置,如 function mouseSim(type, x, y) { var simulatedEven

我使用的不是鼠标,而是跳跃运动。它是一种运动感应设备,允许使用手指、手和手势,而不是鼠标

我有一个代码,可以绘制用户手指与屏幕相交的点,因此用户的手指在网页上用蓝色圆圈表示,与此代码相同:

我在网页上还有一个力定向图,与这个例子相同:bl.ocks.org/mbostock/4062045

我想允许用户在手指与蓝色圆圈相交时拖动节点

我可以让点击模拟代码工作,但当我尝试使用X和Y位置,如

function mouseSim(type, x, y)
{

    var simulatedEvent = document.createEvent("MouseEvent");
    simulatedEvent.initMouseEvent(type, true, true, window, 1,
            x, y,
            x, y, false,
            false, false, false, 0/*left*/, null);

    document.dispatchEvent(simulatedEvent);
    console.log(type + " at " + x + ", " + y);
}
我得到了所需的控制台输出,但没有与图形交互

是否可以使用非鼠标、非触摸事件与D3.js图形交互?如果是这样,最有效的方法是什么?

简单到:

function mouseSim(type, x, y)
{

    var simulatedEvent = document.createEvent("MouseEvent");
    simulatedEvent.initMouseEvent(type, true, true, window, 1,
            x, y,
            x, y, false,
            false, false, false, 0/*left*/, null);

    document.dispatchEvent(simulatedEvent);
    console.log(type + " at " + x + ", " + y);

    doStuffInD3(x,y);
}

function doStuffInD3 (x,y) {
   force directed stuff dependent on x and y
}

在相互作用后,你只是把x和y传递给力函数

您实际上不需要模拟事件来实现这一点,模拟事件可能会使它比需要的更难。只需将leap pointable与节点匹配,将其fixed属性设置为true,以防止force布局更新其位置,并根据pointable的运动移动节点


如果我理解正确,我想我已经实现了。来源可用。

是。力导向图侦听鼠标事件的拖动开始、拖动和拖动。我还没有在JavaScript中成功模拟dragstart、drag或Dragen。