javascript - 如何检测圆圈手势方向？

Question

这是我的代码要点。

Leap.loop({enableGestures: true}, function(frame) {
var gestures = frame.gestures;

for (var i = 0; i < gestures.length; i++) { 
  // I want to do something when draw circle with one pointable 
   if (gesture.type == "circle" && gesture.state == "stop" && gesture.pointableIds.length == 1) {
    var isClockWise = ? ;//  how to know the direction of circle ?
  }
}
} );

如何通过手势对象知道圆圈是顺时针还是逆时针？

我只使用了 2 天的跳跃动作，真的需要你的帮助。

score 4 · Accepted Answer

Leap.loop({enableGestures: true},function(frame) {
var gestures = frame.gestures,
    circle,
    pointable,
    direction,
    normal;
// Check if is there any gesture going on
if(gestures.length > 0) {
    // In this example we will focus only on the first gesture, for the sake of simplicity
    if(gestures[0].type == 'circle') {
        circle = gestures[0];
        // Get Pointable object
        circle.pointable = frame.pointable(circle.pointableIds[0]);
        // Reset circle gesture variables as nedded, not really necessary in this case
        if(circle.state == 'start') {
            clockwise = true;
        } else if (circle.state == 'update') {
            direction = circle.pointable.direction;
            // Check if pointable exists
            if(direction) {
                normal = circle.normal;
                // Check if product of vectors is going forwards or backwards
                // Since Leap uses a right hand rule system
                // forward is into the screen, while backwards is out of it
                clockwise = Leap.vec3.dot(direction, normal) > 0;
                if(clockwise) {
                    //Do clockwose stuff
                } else {
                    //Do counterclockwise stuff
                }
            }
        }
    }
}

});

score 2 · Accepted Answer

查看leap网站上给出的C++示例，给出了一段代码来检测圆圈是否顺时针。

C++ 代码：

if (circle.pointable().direction().angleTo(circle.normal()) <= PI/4)
   {
      clockwiseness = "clockwise";
   }
   else
   {
      clockwiseness = "counterclockwise";
   }

我没有使用过 Javascript API，但我认为这可以是等价的此代码尚未经过测试，但在 Javascript 中可能类似于：

// considere your gesture is a circle, and there is at least one pointable object.
if (gesture.type == "circle" && gesture.state == "stop" && gesture.pointableIds.length >= 1)
{
  var dir = frame.pointables[gesture.pointableIds[0] ].direction; // get direction of the Pointable used for the circle gesture
  var angle = dir.AngleTo (circle.normal);
  var isClockWise =  angle <= (3.14 / 4);
}

从GitHub和Leap Motion 开发者网站获取 Leap JS API 的所有信息

-> 小心frame.pointables返回以任意顺序给出的指向对象。（参见 JS API 文档）。这段代码只是为了解释算法

score 1 · Accepted Answer

这是找出最简单的方法

var isClockwise = (circleGesture.normal[2] <= 0);

它将返回 true 或 false

score 0 · Accepted Answer

在此页面上尝试了其他答案，但无法使其正常工作，稍微简化了代码并最终使其正常工作。pointableID 根据圆形手势的方向将正常记录为负/正。

function pageScrollDown() {
   window.scrollBy(0,10);
};
function pageScrollUp(){
   window.scrollBy(0,-15);
};

$(window).bind('circle', function(e, gesture){

var circle = gesture;

circle.pointable = circle.pointableIds[0];
direction = gesture.normal[1];

    if(direction < 0 ) {
      pageScrollDown();
      } else {
        pageScrollUp();
}
});

score -1 · Accepted Answer

我一直在为我的项目使用“Leap Cursor 库”，它真的很酷。使用这个库识别元素上的圆圈手势非常简单。

var circleTrackElements = document.querySelectorAll(".myDOMElements");
for (var i = 0; i < allTiles.length; i++) {
    circleTrackElements[i].addEventListener("leap-circle-stop", function(e) {
        console.log("CIRCLE DETECTED");
    });
};
LeapManager.init({
    maxCursors : 1,
    interactiveSelector : ".myDOMElements"
});

图书馆的 GITHUB 链接

javascript - 如何检测圆圈手势方向？

5 回答 5

Related

Reference