<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>基于tracking的取人脸</title>
    <script src="js/tracking-min.js"></script>
    <script src="js/face-min.js"></script>
    <script src="js/eye-min.js"></script>
    <script src="js/mouth-min.js"></script>
    <script src="js/jquery-1.11.1.min.js"></script>
</head>
<body>

<div class="face" style="border:1px solid yellow;position:absolute;display:none;"></div>
<img id="img" src="https://img-blog.csdnimg.cn/2022010614020738216.jpeg" alt=""/>

<script>
    //        tracking.ObjectTracker()接受数组参数将你想要标记的对象分类(比如脸部整体、眼睛、鼻子、嘴巴等)。
    //        setStepSize()规定用来标记的方框的步长。
    //        我们把要标记的对象和track事件进行绑定,一旦我们要标记的对象完成初始化,就会触发track事件。
    //        数据(Data)保存在对象数组列表中,其中的值是每一个标记对象的长、宽以及x、y坐标。
    window.onload = function () {
        var img = document.getElementById('img');
        var tracker = new tracking.ObjectTracker(['face']); // Based on parameter it will return an array.
        // tracker.setStepSize(1.7);
        tracking.track('#img', tracker);
        tracker.on('track', function (event) {
            if (event.data.length === 0) {
                alert("无人脸")
            } else {
                var count = 0;
                event.data.forEach(function (rect) {
//                        console.log(event)
                    console.log(rect)
                    draw(rect.x, rect.y, rect.width, rect.height);
                       // alert("有人脸")
                    count++;
                });
                console.log("识别到人脸数量:" + count);
            }
        });
        //画方框
        function draw(x, y, w, h) {
            var face = $(".face").clone(true);
            face.css({"width":w+"px","height":h+"px","left":(img.offsetLeft + x)+"px","top":(img.offsetTop + y)+"px"});
            face.removeClass("face");
            face.show();
            $("#img").before(face);
        }
    }
</script>
</body>
</html>
demo下载地址:https://pan.baidu.com/s/1yjMz7Yir2dB77wvYiYvu_g

js人脸识别,tracker.js前端人脸识别框架相关推荐

  1. 嵌入式linux人脸识别sdk,嵌入式前端人脸识别SDK - AID.Face 正式上线丨OPEN AI

    原标题:嵌入式前端人脸识别SDK - AID.Face 正式上线丨OPEN AI AID.Face是以Tengine/HCL为平台的嵌入式前端人脸识别SDK,可在现有SoC上流畅的使用人脸识别功能,特 ...

  2. 人工智能人脸识别系统,人工智能应用人脸识别

    手机人脸识别的原理是什么? . 不同品牌机型采用的面部识别技术方案不同,面部识别效果也会不一样:目前vivo/iQOO系列手机,仅NEX双屏版采用3D人脸识别技术,其余机型均采用FaceWake面部识 ...

  3. 安卓前端车牌识别技术

    安卓前端车牌识别技术是为促进人工智能化建设研发而来的应用.此应用基于移动端平台,手机.PDA.安卓系统带200万像素以上的摄像头,该安卓移动端前端车牌识别技术sdk,支持android.ios等.An ...

  4. 安卓前端车牌识别技术应用

    安卓前端车牌识别技术应用 安卓前端车牌识别技术,车牌拍摄规范 合理光照,拍摄时注意光照的影响,尽量避免反光和黑影: 避免倾斜,不要使拍摄角度倾斜过大,以免造成车牌严重变型: 聚焦清晰,避免图像模糊不清 ...

  5. 吗咿呀嘿-用js来搞个简单的人脸识别

    缘起 "蚂蚁呀嘿,蚂蚁呀呼,蚂蚁呀哈" 相信最近好多人的朋友圈或者抖音都被类似视频刷过屏! 类似的效果最早是在2020年初,那个时候大家应该还都记得,几乎所有的人都因为疫情原因被迫 ...

  6. 前端机器学习--识别人脸在脸颊上画草莓

    文章目录 前端机器学习--识别人脸在脸颊上画草莓 一.最终结果 二.原理 1. 前端的机器学习 2. 基本原理 三.基于`vue-cli`搞一个 1. 使用`vue-cli`脚手架搭建项目 2. 使用 ...

  7. 前端人脸识别解决方案

    最近业务功能需求开发中Web端需要接入人脸识别,于是做了技术预演 1.第三方解决方案 现有的云服务商解决方案: 市场还有很多类似的解决方案,这里不一一列举,下面是某云服务商的报价 Web API中有个 ...

  8. 利用百度人脸识别API,实现人脸登陆JavaWeb

    JavaWeb利用百度API实现人脸登陆功能 笔者的完整项目 1,在百度云注册人脸库 2,引入必要的包 3,编写java代码 4,介绍对人脸库的增删改查功能 5,该功能加入到我的项目 (1),界面展示 ...

  9. 微信小程序人脸识别/采集改进版-支持人脸中心位置校验,人脸图片采集(速度更快),人脸搜索

    目录 1. 微信小程序人脸识别 1. 初始化人脸识别 2. 创建 camera 上下文 CameraContext 对象 3.获取 Camera 实时帧数据 4.人脸识别,使用前需要通过 wx.ini ...

  10. 【微信小程序】基于百度大脑人体检测、人脸识别以及调用阿里垃圾分类识别小程序利用canvas完成人脸画图、分割手部部分图片算法

    演示 好久没发了,最近在做比赛看下成品演示: 说明:人体出现在镜头里用红色框将人脸圈出来.用黄色框将手部圈出来,定时器触发后,通过百度返回的top+.left+.width+.height+将拍照的截 ...

最新文章

  1. Android源码开发笔记 -- Android数据库,屏幕休眠时间
  2. Android中资源文件夹res/raw和assets的使用
  3. 【Linux】【C/C++】十叉非完全树的构造和重构
  4. react native引入第三方库
  5. 博客文章的置顶功能『博客帮助』
  6. 跨境电商谋定重整新业态-李玉庭:数据驱动中国电商大会
  7. powerbi实时刷新mysql数据库_PowerBI开发 第七篇:数据集和数据刷新
  8. php设置表单为整数,PHP中如何判断FROM表单提交的数字是否为整数?
  9. Hibernate-HQL基础
  10. RTC硬件时钟设置修改【转】
  11. 从零基础入门Tensorflow2.0 ----五、20. 预定义estimator使用
  12. SLAM学习笔记-------------(五)相机与图像
  13. c语言无纸化测评答案,无纸化计算机二级C语言程序设计题库答案程序题
  14. vue项目使用阿里云播放器 Prismplayer 组件,可记录播放时间
  15. OBS教程:3分钟学会直播推流与视频录制
  16. Javaweb面试题整理
  17. Jupyter Notebook:内核似乎挂掉
  18. 速途在线沙龙11期:王通夫唯首次聚首共话SEO
  19. 植物大战僵尸辅助C/C++版
  20. android如何截屏快捷键,安卓手机怎么截图 各大品牌快捷键截屏大集合

热门文章

  1. 解决被西刺代理封ip的问题
  2. IDEA使用教程汇总
  3. 计算机 考 二级结构工程师,下半年河北省结构工程师二级专业结构:计算机软件的组成及功能考试试题.doc...
  4. 反向题在测试问卷信效度_[问卷的信度和效度分析]问卷信度和效度分析
  5. 风格迁移篇---SAnet:风格注意网络下的任意风格转换
  6. matlab 颜色代码 大全_空客 | 红、绿、蓝、白,各类颜色代码的含义
  7. 使用R包GD实现地理探测器算法
  8. arm实验使用keil自带的MDK仿真教程
  9. 企业销售统计管理页面ui模板
  10. CS:APP3e 深入理解计算机系统_3e Datalab实验