jQuery Face Detection 是一款人脸检测插件,能够检测到图片,视频和画布中的人脸坐标。它跟踪人脸并输出人脸模型的坐标位置为一个数组。我们相信,面部识别技术能够给我们的 Web 应用带来各种可能性,创造出互动的,有趣的功能。

  注:人脸识别,是基于人的脸部特征信息进行身份识别的一种生物识别技术。用摄像机或摄像头采集含有人脸的图像或视频流,并自动在图像中检测和跟踪人脸,进而对检测到的人脸进行脸部的一系列相关技术,通常也叫做人像识别、面部识别。

效果演示     插件下载

如何使用:

引入 jQuery 库和插件代码:

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="path/to/dist/jquery.facedetection.min.js"></script>

设置带有人脸的图片:

<img id="picture" src="img/face.jpg">

调用插件代码获得脸部坐标:

<script>
$('#picture').faceDetection({
complete: function (faces) {
console.log(faces);
}
});
</script>

返回的数据:

插件返回的脸部数据

  • x — 图片中人脸的X坐标
  • y — 图片中人脸的Y坐标
  • width — 人脸的宽度
  • height — 人脸的高度
  • positionX — 相对于文档的X坐标
  • positionY — 相对于文档的Y坐标
  • offsetX — 相对于父元素的X偏移
  • offsetY — 相对于父元素的Y偏移
  • scaleX — 实际显示和原始宽度比
  • scaleY — 实际显示和原始高度比
  • confidence — 准确度
您可能感兴趣的相关文章

本文链接:jQuery/Zepto 人脸识别插件,支持图片和视频

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

jQuery 人脸识别插件,支持图片和视频的更多相关文章

  1. 利用jquery的imgAreaSelect插件实现图片裁剪示例

    http://www.cnblogs.com/mizzle/archive/2011/10/13/2209891.html 将用户上传的图片进行裁剪再保存是现在web2.0应用中常常处理的工作,现在借 ...

  2. Java离线人脸识别SDK 支持arcface 2.0 最新版

    虹软人脸识别SDK之Java版,支持SDK 1.1+,以及当前最新版本2.0,滴滴,抓紧上车! JDK SDK Win release license status 前言 由于业务需求,最近跟人脸识别 ...

  3. 19_Android中图片处理原理篇,关于人脸识别站点,图片载入到内存,图片缩放,图片翻转倒置,网上撕衣服游戏案例编写

    1载入图片到内存 (1).数码相机照片特别是大于3m以上的,内存吃不消,会报OutOfMemoryError,若是想仅仅显示原图片的1/8,能够通过BitmapFactory.Options来实现.详 ...

  4. 19_Android中图片处理原理篇,关于人脸识别网站,图片加载到内存,图片缩放,图片翻转倒置,网上撕衣服游戏案例编写

    1加载图片到内存 (1).数码相机照片特别是大于3m以上的,内存吃不消,会报OutOfMemoryError,若是想只显示原图片的1/8,可以通过BitmapFactory.Options来实现,具体 ...

  5. jquery roundabout幻灯片插件3d图片切换支持图片旋转切换滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 让jQuery的ajaxFileUpload插件支持onchange事件

    ajaxFileUpload插件只能上传一次的BUG发现还不少人遇到,很不幸我也遇到的,使用后发现里面的坑还不少,在createUploadForm方法中有句 var newElement = jQu ...

  7. 强大的jQuery幻灯片播放插件 支持全拼、拖拽和下载等功能

    在线演示 本地下载

  8. 【C#】人脸识别 视频数据转图片数据

    使用虹软人脸识别的开发过程中遇到了转换的问题 因为不会用C#直接打开摄像头,就只能用第三方dll.一开始用Aforge,后来发现有个问题,关闭摄像头老是陷入等待,所以抛弃了.前一阵子开始用封装了Ope ...

  9. Android静态图片人脸识别的完整demo(附完整源码)

    Demo功能:利用android自带的人脸识别进行识别,标记出眼睛和人脸位置.点击按键后进行人脸识别,完毕后显示到imageview上. 第一部分:布局文件activity_main.xml < ...

随机推荐

  1. tomcat安装后,本地可以访问,远程不能访问

    问题描述:tomcat安装后,在本地可以使用本地IP地址.localhost可以访问,但是在远程却不能访问. 使用工具:无. 解决方法:关闭服务器端的"公用网络防火墙"即可.

  2. 父容器利用opacity设置透明后,子元素跟着变透明的解决方案

    背景半透明,子元素不透明的效果经常需要用到.通常对父容器使用opacity属性时,子元素也跟着变透明,所以不妨设置父容器的 background-color:rgba(r,g,b,x); 其中x取值从 ...

  3. (哈夫曼树)HuffmanTree的java实现

    参考自:http://blog.csdn.net/jdhanhua/article/details/6621026 哈夫曼树 哈夫曼树(霍夫曼树)又称为最优树. 1.路径和路径长度在一棵树中,从一个结 ...

  4. linux系统如何管理文件

    硬盘中的静态文件和inode(i节点) (1)文件平时都在存放在硬盘中的,硬盘中存储的文件以一种固定的形式存放的,我们叫静态文件. (2)一块硬盘中可以分为两大区域:一个是硬盘内容管理表项,另一个是真 ...

  5. PCD文件去除曲率的脚本

    在写一个重建算法的时候需要用到点坐标和法向的数据文件,于是向利用pcl中的法向计算模块来生成法向.输出后法向文件中包含曲率信息,但是这是不需要的.于是自己写了一个python小脚本实现格式转换. #- ...

  6. 服务端跨域处理 Cors

    1  添加 System.Web.Cors,System.Web.Http.Cors 2 global文件中 注册asp.net 管道事件 protected void Application_Beg ...

  7. c++局域网多播

    转自http://www.51cto.com/specbook/17/35216.htm Visual C++实现局域网IP多播 在局域网中,管理员常常需要将某条信息发送给一组用户.如果使用一对一的发 ...

  8. 使用UITableView的分组样式

    分组样式顾名思义是对TableView中的数据行进行分组处理,每个分组都有一个header和footer. TableView中header的英文文本是大写的,footer的英文文本是小写的.如下图浅 ...

  9. Leetcode分类刷题答案&心得

    Array 448.找出数组中所有消失的数 要求:整型数组取值为 1 ≤ a[i] ≤ n,n是数组大小,一些元素重复出现,找出[1,n]中没出现的数,实现时时间复杂度为O(n),并不占额外空间 思路 ...

  10. Android 实时监测(监听)网络连接状态变化

    http://blog.csdn.net/mxiaoyem/article/details/50708052