在上篇《Node.js Leap Motion 开启AR的小窗 》中,我们介绍了如何写一个Leap Motion的Hello World。
这一篇,让我们来玩玩简单的手势控制。
这次,我们需要在起Server的时候,允许手势控制:
var leapjs = require('leapjs'),
controller = new leapjs.Controller({
enableGestures: true,
frameEventName: 'animationFrame'
});
然后,就是客户端代码。
这时,我们的客户端将通过ws://127.0.0.1:6437/v6.json
来获取一些相关的数据,如下是一个手势时返回的数据:
[
{
"currentFrameRate": 115.121,
"devices": [],
"gestures": [
{
"direction": [
0.043004399999999998,
0.99689099999999997,
-0.066029199999999996
],
"duration": 0,
"handIds": [
646
],
"id": 7,
"pointableIds": [
6461
],
"position": [
-33.822299999999998,
196.53899999999999,
-100.524
],
"speed": 223.33099999999999,
"startPosition": [
-39.386699999999998,
67.549899999999994,
-91.980800000000002
],
"state": "start",
"type": "swipe"
}
]
...
]
通过判断数据中的gesture.type
,我们可以判断这是一个Swipe(滑动)手势。
如下是一个circle类似:
"gestures": [
{
"center": [
-41.580500000000001,
124.26600000000001,
-15.910399999999999
],
"duration": 0,
"handIds": [
645
],
"id": 11,
"normal": [
0.75557799999999997,
-0.176064,
0.63095400000000001
],
"pointableIds": [
6450
],
"progress": 0.78971100000000005,
"radius": 36.578299999999999,
"state": "start",
"type": "circle"
}
],
我们只需要通过判断gesture.direction的值就可以判断是往哪个方面,代码如下:
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";
}
}
So,我们可以判断下手势的类似:
Leap.loop(function (frame) {
if (frame.valid && frame.gestures.length > 0) {
frame.gestures.forEach(function (gesture) {
switch (gesture.type) {
case "circle":
console.log("Circle Gesture");
break;
case "keyTap":
console.log("Key Tap Gesture");
break;
case "screenTap":
console.log("Screen Tap Gesture");
break;
case "swipe":
console.log("Swipe");
handleSwipe(gesture);
break;
}
});
}
随后,依据手势的类似来判断方向,如:
var handleSwipe = function (gesture) {
var swipeDirection;
//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";
}
}
console.log(swipeDirection);
window.swipeDirection = swipeDirection;
return swipeDirection;
};
等我们完成了更多的连接和判断,我们就可以完成与Oculus的集成。
围观我的Github Idea墙, 也许,你会遇到心仪的项目