JavaScript人臉識別技術及臉部識別JavaScript類庫Tracking.js
我一直對人工智能識別技術非常感興趣,因為我無法想象這究竟是一種什么樣的算法,什么樣的分析過程。無論是聲音識別、人臉識別或其它種識別,人們的外貌、說話的方式都是如此不同,一種圖片你可以用不同的方式、從不同的角度拍攝,我不能理解這些識別技術是如何做到的。有個叫做“面具”的游戲也使用了這種識別技術,我想對于臉部識別技術也應該研究一下。Facebook使用了這種技術,在手勢控制中也能用到它,所以,你網(wǎng)站上也會有應用的地方。
我找到的一個可以用于人臉識別的JavaScript程序包是Face Detection,它是由Jay Salvat和Liu Liu開發(fā)的。它是一個標準的jQuery插件,通過對提供的圖片進行分析,返回所有找到的臉部圖像的坐標。下面我們來看看它是如何使用的!
jQuery.faceDetection
使用Face Detection這個jQuery plugin,你需要引入四個js文件:
<script src="jquery-1.4.3.min.js"></script> <!-- mas js --> <script src="facedetection/ccv.js"></script> <script src="facedetection/face.js"></script> <script src="jquery.facedetection.js"></script>
這個臉部識別插件的頭兩個文件里是它的各種功能性程序,通過它們能得到一個數(shù)組對象,這些對象里存儲的就是圖片里的臉部坐標信息。下面是一個例子:
var coords = jQuery("#myImage").faceDetection(); /* 返回: { x: 525 y: 435, width: 144, height: 144, positionX: 532.6353328125226, positionY: 443.240976080536, offsetX: 532.6353328125226, offsetY: 443.240976080536, confidence: 12.93120119, neighbour: undefined, } */
你還可以在檢測方法上加入事件回調函數(shù):
var coords = jQuery("#myImage").faceDetection({ complete: function(image, coords) { // Do something }, error: function() { console.warn("無法分析圖片"); } });
對于識別出的臉部信息,你可以做任何的處理東西。你可以在圖片中臉部的位置畫出框線:
jQuery("img").each(function() { var img = this; // 獲取臉部坐標 var coordinates = jQuery(img).faceDetection(); // 在臉上畫出框線 if(coordinates.length) { coordinates.forEach(function(coord) { jQuery("<div>", { css: { position: "absolute", left: coord.positionX + 5 + "px", top: coord.positionY + 5 + "px", width: coord.width + "px", height: coord.height + "px", border: "3px solid white" } }).appendTo(img.parentNode); }); } });
這很簡單,當然你可以做復雜的處理,比如說提取出來。
我用了各種圖片進行臉部識別嘗試,正如我預想到的,結果并不是很完美。但不管怎樣,還是相當不錯的。這是一個很簡單的腳本技術,而且沒有任何技術是十全十美的。這個臉部識別插件并不具有臉部比較功能,你需要用其它方法并提供面部特征信息實現(xiàn)此功能??傊?,相當不錯,強烈建議你試一下。
臉部識別JavaScript類庫Tracking.js
對Web開發(fā)者而言,開源的JavaScript庫Tracking.js正在使計算機視覺和增強現(xiàn)實技術變得簡單, 使用它可以展示效果類似Kinect或者Wii的體感應用,且該JavaScript庫體積小 (~7k),非常輕量級,且接口簡潔。
Tracking.js 能夠在移動Web應用、桌面應用中工作,甚至可以和基于Node.js的服務器進行配對。 它會給瀏覽器帶來計算機圖形學算法和技術,其擁有功能:臉部識別(某個特定的顏色時或人物/臉龐/身體出現(xiàn)移動的時候)、實時色彩跟蹤。對于Web開發(fā)而言,以前需要通過C或C++的技術才能實現(xiàn)類似效果。而現(xiàn)在Traking.js提供了一個Web組件,因此Web前端開發(fā)人員可以訪問HTML標簽組件來實現(xiàn)類似功能,而無需了解JavaScript,這極大的簡化了Web開發(fā)。
Tracking.js包括一個色彩跟蹤算法和對象跟蹤組件,它能使Web瀏覽器識別臉部及眼睛的變化。例如,Web前端還可以對于用這個功能來設置用戶頭像,對一些網(wǎng)站而言,這也是個很炫的功能;同時對跟蹤的臉部數(shù)據(jù)和后臺數(shù)據(jù)庫進行匹配,從而和反饋給用戶更多有用的數(shù)據(jù)。
目前,在GitHub上Tracking.js源碼工程已經被Fork了200次以上,8月份上旬,該JS庫已經升級為1.0版本。
以上內容就是給大家分享的JavaScript人臉識別技術及臉部識別JavaScript類庫Tracking.js,希望大家喜歡。
相關文章
js核心基礎之構造函數(shù)constructor用法實例分析
這篇文章主要介紹了js核心基礎之構造函數(shù)constructor用法,結合具體實例形式分析了javascript構造函數(shù)constructor概念、原理、使用方法及相關操作注意事項,需要的朋友可以參考下2019-05-05typescript環(huán)境安裝并開啟VSCode自動監(jiān)視編譯ts文件為js文件
這篇文章主要介紹了安裝typescript環(huán)境并開啟VSCode自動監(jiān)視編譯ts文件為js文件,本文教大家最基礎的安裝和配置自動監(jiān)視ts文件編譯成js文件,需要的朋友可以參考下2022-06-06layui異步加載table表中某一列數(shù)據(jù)的例子
今天小編就為大家分享一篇layui異步加載table表中某一列數(shù)據(jù)的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09window.print打印指定div指定網(wǎng)頁指定區(qū)域的方法
這篇文章主要介紹了window.print打印指定div指定網(wǎng)頁指定區(qū)域的方法,需要的朋友可以參考下2014-08-08