headtrackr 是一个用于实时脸部追踪和头部追踪的 JS 库。通过网络摄像头和 webRTC/getUserMedia 标准，在相关计算机屏幕上追踪用户头部的位置。

创新互联专注为客户提供全方位的互联网综合服务，包含不限于成都做网站、网站设计、外贸营销网站建设、平谷网络推广、小程序制作、平谷网络营销、平谷企业策划、平谷品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；创新互联为所有大学生创业者提供平谷建站搭建服务，24小时服务热线：028-86922220，官方网址：www.cdcxhl.com

如果你要看示例，可观看这个视频。或者拿有摄像头、浏览器支持 webRTC/getUserMedia 的笔记本，试试下面的例子。（你所使用的浏览器是否支持 webRTC/getUserMedia，请看这个网页。）

示例

[[105511]] [[105510]]

[[105512]] [[105513]]

使用方法

下载 headtrackr.js 库，在代码载入。

下面代码，video 元素将用于 mediastream，canvas元素用于复制videoframes。

 
 
 

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  var videoInput = document.getElementById('inputVideo');  
  
  
  
  var canvasInput = document.getElementById('inputCanvas');  
  
  
  
   
  
  
  
  var htracker = new headtrackr.Tracker();  
  
  
  
  htracker.init(videoInput, canvasInput);  
  
  
  
  htracker.start();  
  
  
  
 
 
 
 

当头部追踪启动后，会生成两个事件 headtrackingEvent 和 facetrackingEvent。 headtrackingEvent 事件有3个属性： x、 y、 z，表示用户头部在屏幕中心的估测位置，以厘米为单位。facetrackingEvent 事件有5个属性： x、 y、 width、height、angle，表示用户脸部的估测位置，和在视频中的大小。

你也可以创建一个事件监听器来处理这些事件，或者如果你在用three.js，可以尝试用其中的 pre-packaged controllers 做伪3D效果。

如果想知道更多使用方法，请查看以上事例的源码。Reference - Overview

许可

Headtrackr.js 遵循 MIT License，其中来自  Liu Liu 和 Benjamin Jung 贡献的代码分别遵循 BSD-3 License 和 MIT License respectively。

英文原文：headtrackr

译文链接：http://blog.jobbole.com/31213/

当前标题：headtrackr：一个头部/脸部追踪的JavaScript库
分享链接：http://www.gydahua.com/article/dpdjphd.html