弹来弹去跑马灯!

JS摄像头手势识别-Handsfree.js

Handsfree.js是一个前端库,能够识别人的手势、面部和肢体动作

介绍文章:Handsfree.js — 一个通过计算机视觉集成手势,面部表情和各种姿势识别的前端库-CSDN博客

一下是示例:

<head>
  <!-- Import helper classes and styles -->
  <link
    rel="stylesheet"
    href="https://unpkg.com/handsfree@8.1.1/build/lib/assets/handsfree.css" />
</head>
<body>
  <!-- Import Handsfree.js in body (as it adds body classes) -->
  <script src="https://unpkg.com/handsfree@8.1.1/build/lib/handsfree.js"></script>
 
 
  <script>
    // Use the hand with defaults (and show the webcam with wireframes)
    handsfree = new Handsfree({
      showDebug: true,
      hands: true
    })
 
 
    // Start webcam and tracking (personally, I always like to ask first)
    handsfree.start()
	
 
// Let's create a plugin called "logger" to console.log the data
handsfree.use('logger', (data) => {
  // I like to always bail if there's no data,
  // which might happen if you swap out hands for the face later on
  if (!data.hands) {
    return;
  }
 
  // Log the data  
  //console.log(data.hands)
  if (!data.hands.pinchState) {
    return;
  }
  // Do something if we are pinching with left [0] pinky [3]
  if (data.hands.pinchState[0][3] === 'held') {
    console.log('pinching with left pinky')
  }
  
});
                        
//原文链接:https://blog.csdn.net/u013919171/article/details/113520574


</script>
</body>

  

posted @ 2025-07-25 10:38  wgscd  阅读(39)  评论(0)    收藏  举报