当前位置: 首页 > 工具软件 > Tracking.js > 使用案例 >

一个试验 tracking.js进行人脸拍照

蓝慈
2023-12-01

程序如下:

window.onload = function() {
            var video = document.getElementById('video');
            var canvas = document.getElementById('canvas');
            var context = canvas.getContext('2d');

            var tracker = new tracking.ObjectTracker('face');
            tracker.setInitialScale(4);
            tracker.setStepSize(2);
            tracker.setEdgesDensity(0.1);

            this.trackerTask = tracking.track('#video', tracker, {
                camera: true
            });

            tracker.on('track', function(event) {
                context.clearRect(0, 0, canvas.width, canvas.height);
                if (event.data.length === 0) {

                } else {
                    event.data.forEach(function(rect) {
                        context.strokeStyle = '#a64ceb';
                        context.strokeRect(rect.x, rect.y, rect.width, rect.height);
                        context.font = '11px Helvetica';
                        context.fillStyle = "#fff";
                        context.fillText('x: ' + rect.x + 'px', rect.x + rect.width + 5, rect.y + 11);
                        context.fillText('y: ' + rect.y + 'px', rect.x + rect.width + 5, rect.y + 22);
                        context.drawImage(video, 0, 0, 320, 250)
                        canvas.toBlob(function(blob) {
                            saveAs(blob, 'image.png');
                        })
                        console.log(rect);
                        this.trackerTask.stop()
                            // 关闭摄像头
                        this.trackerTask.closeCamera()
                    });
                }
            });

实现的需求是~调用pc端摄像头,检测到人脸,进行拍照,将拍摄后的照片保存,后续逻辑应该是把拍摄照片和本地照片比对,但是这部分没有写完,不放了。

实验证明判断准确率不太高,可能是程序有问题?实际上它不仅拍脸,手也拍,但摄像头前没有任何东西的时候不会拍,很神奇。

事先需要引用:

    <script src="../build/tracking-min.js"></script>
    <script src="../build/data/face-min.js"></script>
    <script src="FileSaver.js"></script>

FileSaver.js是为了保存图片。

看过一些博客,这篇大概综合了一下,包含人脸识别+拍照文件下载,但实际上大部分识别代码取材于官方文档。那些复制粘贴官方文档的朋友好坑啊。

后续有学习tracking.js的话再继续写。

 类似资料: