鲨鱼网
你对人脸识别感兴趣吗？JavaScript实现的人脸检测方法
创始人
2025-01-10 10:21:08
0次

我一直对视频和图片中的人脸标记、检测和人脸识别技术很感兴趣。尽管我知道获取逻辑和算法去开发人脸识别软件或者插件已经超出了我的想象。当我知道Javascript库可以识别微笑，眼睛和脸部结构时，我得到启发去写一个教程。有许多的库，这些库要不就是纯粹的基于Javascript的，要不就是基于java语言的。

今天，我们开始学习tracking.js,它是一个由Eduardo Lundgren开发的轻量级的javascript库，它可以让你做实时的人脸检测，色彩追踪和标记好友的脸。在这个教程中，我们将会看到，我们如何从静态图片中检测脸，眼睛和嘴巴。

在教程的***，你可以看到一个教程提供可以用的例子，这个例子有技巧和提示以及更多的技术细节。

首先，我们需要建立一个工程，从github中下载这个工程并且抽取build文件夹，根据你的文件和目录结构放置build文件夹。在这个教程里，我用了如下的文件和目录结构。

文件夹结构

  1. Project Folder  
  2. │  
  3. │   index.html  
  4. │  
  5. ├───assets  
  6. │       face.jpg  
  7. │  
  8. └───js  
  9.     │   tracking-min.js  
  10.     │   tracking.js  
  11.     │  
  12.     └───data  
  13.             eye-min.js  
  14.             eye.js  
  15.             face-min.js  
  16.             face.js  
  17.             mouth-min.js  
  18.             mouth.js 

你可以看到js文件夹里有我们从tracking.js中抽取的javascript文件。下面是index.html的html代码。

HTML代码

  1.  
  2.  
  3.  
  4.    
  5.   @tuts Face Detection Tutorial 
  6.    
  7.    
  8.    
  9.    
  10.    
  11.    
  12.    
  13.  
  14.  
  15.  
  16.    
 
  •    
  •  
  •  

    • 在上面的HTML代码中，我们引入4个javascript来自于tracking.js的文件，这些文件有助于我们从图片中检测人脸、眼睛和嘴巴。现在我们写一段代码来实现从静态图片中检测人脸，眼睛和嘴巴。我故意选用这张图片，因为这张图片中有多张不同表情和姿势脸。

    face

    为了达成目标，我们需要修改html文件头部的代码。

    HTML 代码

    1.  
    2.  
    3.  
    4.    
    5.   @tuts Face Detection Tutorial 
    6.    
    7.    
    8.    
    9.    
    10.    
    11.    
    12.    
    13. // tracking code.  
    14.  
    15.    
    16.  
    17.  
    18.  
    19.    
     
  •    
  •  
  •  

    • 结果

    resutlface

    代码说明.

    • tracking.ObjectTracker() 方法对你想要进行跟踪的对象进行了分类，它可以接受一个数组作为参数.

    • setStepSize() 指定的块的步进大小.

    • 我们将要跟踪的对象绑定上 “track” 事件, 对象一被跟踪，很快正在跟踪的对象就会触发跟踪事件.

    • 我们以对象数组的形式中获取数据，里面有每个对象（脸部，嘴部很眼部）的宽度，高度 , x 和 y 坐标;

    结果总结.
    你可能会发现结果会根据形状的条件而有所不同, 还有地方需要改进和提高，而我们也承认并且真心认同对于这种类型的API的开发.

    运行示例:

    带有的图片的运行示例.

    更多资源 – 基于 Javascript 的面部识别

    https://github.com/auduno/headtrackr

    https://github.com/auduno/clmtrackr

    我们计划为 HTML5 的 Canvas 和摄像头视频的脸部跟踪以及图像标签做一个教程。你可能会用到我上面提到的客户端访问摄像头博客，它可以帮助你，用你知道的方式去访问用户的摄像头。

    注意：由于浏览器安全性的原因，这个程序需要运行在一样的域或者禁用网络安全的浏览器中。

    喜欢这篇文章吗？

    您要是有建议，补充，或者在这篇文章中发现错误，信息过时。我们期待你的评论。

    请您花一点时间将文章分享给您的朋友或者留下评论。我们将会由衷感谢您的支持！

    英文原文：Javascript based Face Detection Method

    上一篇：Docker和谷歌容器对云未来的意义

    下一篇：发改委对高通罚款61亿元 要求高通作出5项整改

    相关内容

    热门资讯

    PHP新手之PHP入门 PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的...
    网络中立的未来 网络中立性是什... 《牛津词典》中对“网络中立”的解释是“电信运营商应秉持的一种原则，即不考虑来源地提供所有内容和应用的...
    各种千兆交换机的数据接口类型详... 千兆交换机有很多值得学习的地方，这里我们主要介绍各种千兆交换机的数据接口类型，作为局域网的主要连接设...
    粉嫩如何诠释霸道 东芝M805... “霸道粉”是个什么玩意东芝M805拿过来的时候，笔者扑哧笑了，不是笑这款笔记本，而是笑这款产品的颜色...
    如何利用交换机和端口设置来管理... 在网络管理中，总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
    什么是大数据安全 什么是大数据... 在《为什么需要大数据安全分析》一文中，我们已经阐述了一个重要观点，即：安全要素信息呈现出大数据的特征...
    全面诠释网络负载均衡 负载均衡的出现大大缓解了服务器的压力，更是有效的利用了资源，提高了效率。那么我们现在来说一下网络负载...
    如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下，MySQL服务器仅侦听来自localhos...
    30分钟搞定iOS自定义相机 最近公司的项目中用到了相机，由于不用系统的相机，UI给的相机切图，必须自定义才可以。就花时间简单研究...
    Windows恶意软件20年“... 在Windows的早期年代，病毒游走于系统之间，偶尔删除文件（但被删除的文件几乎都是可恢复的），并弹...