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. yii2 随笔

    view 1.添a标签 use yii\helpers\Html; //需要引用html组件 <?= Html::a('点击', ['sign/sign','id' => '01']) ? ...

  2. Monthly Income Report – August 2016

    原文链接:https://marcoschwartz.com/monthly-income-report-august-2016/ Every month, I publish a report of ...

  3. (转)socket Aio demo

    原文地址: https://my.oschina.net/tangcoffee/blog/305656 参考文档: http://my.oschina.net/u/862897/blog/164425 ...

  4. Unity 重要基础知识点

    这是两个月前的学习记录,发出来了下,如果有误欢迎大家指出: 脚本生命周期 //每当脚本被加载时调用一次 // 1.   在Awake中做一些初始化操作 void Awake(){ //初始化publi ...

  5. POJ 2356. Find a multiple 抽屉原理 / 鸽巢原理

    Find a multiple Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7192   Accepted: 3138   ...

  6. Java程序设计求出岁数

    题目:我年龄的立方是个4位数.我年龄的4次方是个6位数.这10个数字正好包含了从0到9这10个数字,每个都恰好出现1次,求出我今年几岁. 直接拷贝运行就可以了. public class Age { ...

  7. [No0000A1]人体排毒时间表,别再信了

    经常可以看到有「人体排毒时间表」这样的说法,不同的媒体反复传播,大同小异.这些说法里,大多把人体的系统器官都给安排了一个特定的时段,认为在某时段是某器官的排毒时间,睡觉能排一切毒.事实上果真如此么?让 ...

  8. 完整部署CentOS7.2+OpenStack+kvm 云平台环境(4)--用OZ工具制作openstack镜像

    在部署openstack云平台环境的时候,需要上传镜像到glance. 首先下载iso镜像,这里下载了centos6.5镜像,放到/usr/local/src目录下然后用OZ工具制作openstack ...

  9. mysql中间件atlas配置使用

    MySQL所在机器: 192.168.16.70(Master) 192.168.16.74(Slave)      192.168.16.72(atlas)注意:主从复制需要自行配置atlas配置使 ...

  10. TextView字体阴影效果

    android:shadowDx="1" android:shadowDy="1" android:shadowColor="#8c8c8c" ...