手势识别产品系统

我要开发同款
丐帮帮主药仙2026年04月16日
15阅读

技术信息

语言技术
HTML5CSSJavaScriptReactNode.js
系统类型
Web
行业分类
人工智能

作品详情

行业场景

通过leap2设备通过手势控制鼠标移动,在网页中通过tensorFlow.js手势模型实
现自定义手势命令,如:翻页。leap2通过内置websocket推送服务发送骨节点的点位信息,
前端通过threejs导入blender中导出的手部带骨骼模型,根据手指不同的节点位置分析空间信
息操作模型的骨骼来完成动画。手部的位置移动则采用了leap2官网的非接触式web插件来根
据另一个推送接受手的事件信息来代替鼠标其中就包括几只手、手的位置、距离屏幕距离、手
的进入进出。基于tensorFlow.js手部模型则采用普通相机,将视频流传给模型,模型分析视
频流得到手部的21个骨节点和最佳达分手势,再根据点位信息用canvas绘制出手的线型。

功能介绍

通过leap2设备通过手势控制鼠标移动,在网页中通过tensorFlow.js手势模型实
现自定义手势命令,如:翻页。leap2通过内置websocket推送服务发送骨节点的点位信息,
前端通过threejs导入blender中导出的手部带骨骼模型,根据手指不同的节点位置分析空间信
息操作模型的骨骼来完成动画。手部的位置移动则采用了leap2官网的非接触式web插件来根
据另一个推送接受手的事件信息来代替鼠标其中就包括几只手、手的位置、距离屏幕距离、手
的进入进出。基于tensorFlow.js手部模型则采用普通相机,将视频流传给模型,模型分析视
频流得到手部的21个骨节点和最佳达分手势,再根据点位信息用canvas绘制出手的线型。

项目实现

开发工具:VSCode、leapMation
应用技术:React+tensorFlow.js+webcam
通过leap2设备通过手势控制鼠标移动,在网页中通过tensorFlow.js手势模型实
现自定义手势命令,如:翻页。leap2通过内置websocket推送服务发送骨节点的点位信息,
前端通过threejs导入blender中导出的手部带骨骼模型,根据手指不同的节点位置分析空间信
息操作模型的骨骼来完成动画。手部的位置移动则采用了leap2官网的非接触式web插件来根
据另一个推送接受手的事件信息来代替鼠标其中就包括几只手、手的位置、距离屏幕距离、手
的进入进出。基于tensorFlow.js手部模型则采用普通相机,将视频流传给模型,模型分析视
频流得到手部的21个骨节点和最佳达分手势,再根据点位信息用canvas绘制出手的线型。

示例图片

声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论