通过跳跃动作检测滑动手势
Detect swipe gesture with leap motion
我知道如何从左右检测手势
这
我想知道如何检测手势向上,向下和圆圈。
我的英语很差。我想你无法理解,但请帮助我。
对于轻扫方向,可以比较 Gesture 对象的方向属性的 x 和 y 坐标。在 Leap Motion JavaScript API 中,向量由 3 元素数组表示。所以:
gesture.direction[0] is the x coordinate (left to right)
gesture.direction[1] is the y coordinate ( up, down)
gesture.direction[2] is the z coordinate (front to back)
您引用的示例仅查看 x 坐标的符号 - 因此所有滑动都分为右或左。要将轻扫分类为向上或向下,您必须比较 x 和 y 坐标的大小,以确定轻扫是更水平还是更垂直,然后比较坐标的符号以确定水平轻扫是向左还是向右还是垂直轻扫是向上还是向下。
圆形手势被报告为不同类型的手势,因此您可以查看 gesture.type 属性。
下面是一些说明这一点的 JavaScript(改编自 Leap Motion SDK 附带的 Sample.html 文件):
// Store frame for motion functions
var previousFrame = null;
// Setup Leap loop with frame callback function
var controllerOptions = {enableGestures: true};
Leap.loop(controllerOptions, function(frame) {
// Display Gesture object data
var gestureOutput = document.getElementById("gestureData");
var gestureString = "";
if (frame.gestures.length > 0) {
for (var i = 0; i < frame.gestures.length; i++) {
var gesture = frame.gestures[i];
switch (gesture.type) {
case "circle":
gestureString += "<br>ID: " + gesture.id + "<br>type: " + gesture.type + ", "
+ "<br>center: " + vectorToString(gesture.center) + " mm, "
+ "<br>normal: " + vectorToString(gesture.normal, 2) + ", "
+ "<br>radius: " + gesture.radius.toFixed(1) + " mm, "
+ "<br>progress: " + gesture.progress.toFixed(2) + " rotations"
+ "<br>";
break;
case "swipe":
//Classify swipe as either horizontal or vertical
var isHorizontal = Math.abs(gesture.direction[0]) > Math.abs(gesture.direction[1]);
//Classify as right-left or up-down
if(isHorizontal){
if(gesture.direction[0] > 0){
swipeDirection = "right";
} else {
swipeDirection = "left";
}
} else { //vertical
if(gesture.direction[1] > 0){
swipeDirection = "up";
} else {
swipeDirection = "down";
}
}
gestureString += "<br>ID: " + gesture.id + "<br>type: " + gesture.type + ", "
+ "<br>direction " + swipeDirection
+ "<br>gesture.direction vector: " + vectorToString(gesture.direction, 2) + ", "
+ "<br>";
break;
}
}
}
gestureOutput.innerHTML = gestureString + gestureOutput.innerHTML;
})
function vectorToString(vector, digits) {
if (typeof digits === "undefined") {
digits = 1;
}
return "(" + vector[0].toFixed(digits) + ", "
+ vector[1].toFixed(digits) + ", "
+ vector[2].toFixed(digits) + ")";
}
要使用它,请将其放在将要执行的位置,并在 HTML 文档正文中包含带有 id gestureData 的元素:
<div id="gestureData"></div>
我的一个朋友正是为此目的制作了一个库。它检查 6 个不同方向的滑动,并可以判断圆圈手势的方向。
https://github.com/L1fescape/curtsy
他的代码也应该易于阅读,所以如果你想看看他是如何做事的。
相关文章:
- 如何检测是否有溢出
- 如何检测用于WebGL的专用或集成显卡
- 防止Alt+Shift默认操作或检测多种操作系统语言的Javascript
- 如何在使用selectBoxIt JQuery插件时检测选项更改
- 如何使用密码检测网络中的状态连接
- 使用JavaScript检测Flash
- 在不阻止默认行为的情况下检测IE10中的缩放
- 检测个位数整数时正在转换毫秒
- 检测电话窃听,即:<a href="电话:xxx">在UIWebview上
- 动态插入的表:JQuery未检测到最后一行
- 检测页面上某个元素中选择(突出显示)或单击的内容
- jQuery检测浏览器是否支持Zoom
- 检测iframe是否跨域的愚蠢方法
- 检测图像分辨率
- 如何检测第三方广告服务器请求
- 我是否可以检测到javascript正在被卸载(作为调试模式)
- 当没有文本输入聚焦时检测空格键按下
- 正在检测导航到<a name=“;最新主题”></a>
- 如何检测重叠元素下的单击
- 通过跳跃动作检测滑动手势