這篇文章主要講解了如何使用tracking.js頁面人臉識(shí)別插件,內(nèi)容清晰明了,對(duì)此有興趣的小伙伴可以學(xué)習(xí)一下,相信大家閱讀完之后會(huì)有幫助。
創(chuàng)新互聯(lián)是專業(yè)的南開網(wǎng)站建設(shè)公司,南開接單;提供成都網(wǎng)站制作、成都網(wǎng)站建設(shè),網(wǎng)頁設(shè)計(jì),網(wǎng)站設(shè)計(jì),建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進(jìn)行南開網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴(kuò)展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團(tuán)隊(duì),希望更多企業(yè)前來合作!
tracking.js是頁面識(shí)別人臉的一個(gè)插件,首先是tracking.js的git地址
在下載完tracking.js后,我們需要一個(gè)能測(cè)試的頁面,這個(gè)頁面需要在服務(wù)器上,比如本地的localHost:8080。然后需要引入兩個(gè)檢查人臉必須的文件tracking-min.js和face-min.js。 `
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); tracking.track('#video', tracker, { camera: true }); tracker.on('track', function(event) { context.clearRect(0, 0, canvas.width, canvas.height); 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); }); });`
上面這些事主要的人臉檢測(cè)使用代碼其中:
tracker.setInitialScale(4);
tracker.setStepSize(2);
tracker.setEdgesDensity(0.1);
這些是設(shè)置的參數(shù),文檔中沒有明確的說明,暫時(shí)不知道用處??梢酝ㄟ^tracker.stop()來停止頁面對(duì)人臉的監(jiān)聽。
如果是要監(jiān)聽攝像頭的人像就必須判斷瀏覽器是否支持接入攝像頭,其中最主要的方法是navigator.getUserMedia,具體的說明參考這里。在獲取攝像頭之后就可以監(jiān)聽攝像頭,判斷是否有人臉,在track事件中就可以截取需要的圖片。
具體的截取方法:
var canvas = $('canvas'), context = canvas.getContext('2d'), video = $('video'); context.drawImage(video, 0, 0, 200, 150); var snapData = canvas.toDataURL('image/png'), var imgSrc = "data:image/png;" + snapData;
imgSrc 可以直接用于頁面圖片的顯示。
看完上述內(nèi)容,是不是對(duì)如何使用tracking.js頁面人臉識(shí)別插件有進(jìn)一步的了解,如果還想學(xué)習(xí)更多內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
當(dāng)前文章:如何使用tracking.js頁面人臉識(shí)別插件
網(wǎng)址分享:http://www.rwnh.cn/article28/jjsgjp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供Google、營(yíng)銷型網(wǎng)站建設(shè)、軟件開發(fā)、企業(yè)建站、App開發(fā)、微信公眾號(hào)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)