本文轉載自公眾號“讀芯術”(ID：AI_Discovery)。

很多人都能運行操作計算機視覺應用程序。是的，學習并執行它并不難，現在有很多庫可以用來執行如此強大的計算機視覺應用程序。

你有沒有關注最近有沒有看TensorFlow2020峰會?今年，TensorFlow團隊發布了很多非常酷的產品，本文就將介紹如何使用tensorflow.js模型執行計算機視覺應用程序。

什么是TensorFlow.js?

TensorFlow.js是一個開源代碼庫，用于JavaScript中的機器學習應用程序和開發機器學習模型，并直接在瀏覽器或Node.js中使用機器學習。

什么是Tensorflow.js模型?

Tensorflow.js模型是經過預先訓練的模型，用戶無需為訓練模型而準備/收集數據。這些模型托管在NPM(網絡性能監控器)和unpkg上，可以應用于任何現成的項目。

本文將介紹tensorflow.js中的MediaPipeFacemesh模型。該模型是為移動設備上的前置攝像頭設計的，在這些攝像頭中，人臉往往會占據較大一部分畫面。

Facemesh模型演示

facemesh模型會根據筆者的面部動作移動視頻幀。執行下面的計算機視覺應用程序需要哪些步驟呢?

第1步：這些是執行計算機視覺應用程序的三個重要的獨立運行腳本標簽代碼。

<scriptsrcscriptsrc="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-core"></script> 
<scriptsrcscriptsrc="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-converter"></script> 
<scriptsrcscriptsrc="https://cdn.jsdelivr.net/npm/@tensorflow-models/facemesh"></script> 

• TensorFlow.js核心，用于神經網絡和數值計算的靈活API。
• TensorFlow.js轉換器，將TensorFlowSavedModel導入TensorFlow.js的工具。
• facemesh包可查找圖像中的面部邊界和界標。

第2步：在主題內容中加入視頻HTML標簽，從而通過網絡攝像頭識別面部。

<videowidthvideowidth=640 height=480 autoplay muted id=”camera”></video> 

第3步：通過腳本處理(通常是JavaScript)，使用畫布標簽動態繪制圖形。

<canvaswidthcanvaswidth=640 height=480 id=”augmented_canvas”></canvas> 

第4步：在畫布標簽上添加視頻標簽以播放視頻幀，從而根據面部動作移動視頻幀。

<videoautoplay loop id=”movie” style=”visibility: hidden”> 
<sourcesrcsourcesrc=”TensorFlowjs.mp4" type=”video/mp4"></source> 
</video> 

第5步：加載人臉模型并估計人臉大小，從而在圖像中找到人臉邊界和界標。

//load camerastream 
const frame =document.getElementById("camera");//load movie stream 
const movie =document.getElementById("movie"); 
movie.play();//preparecanvas 
const canvas =document.getElementById("augmented_canvas"); 
const draw =canvas.getContext("2d");const result = awaitmodel.estimateFaces(frame, false); 

第6步;在檢測到的人臉上使用以下代碼繪制視頻幀。

//copy camerastream to canvas 
draw.drawImage(frame,0, 0, 640, 480);//check if face is detected 
 if(result.length > 0) 
 { 
  for (let i = 0; i < result.length; i++) { 
    const start = result[i].topLeft; 
    const end = result[i].bottomRight; 
    const size = [end[0] — start[0], end[1] —start[1]];   //Render a rectangle over each detected face. 
   draw.drawImage(movie, start[0], start[1],size[0], size[1]); 
  } 
  
} 

完成啦!按照上面的六個步驟就可以執行計算機視覺應用程序。所有人都認為想成為數據科學家就必須熟悉python或R編程語言，現在，使用javascript就可以執行機器學習應用程序啦。