讓我們看看使用tensorflow.js實施計算機視覺應用程序的簡單方法!
介紹
如今,許多人實現了計算機視覺應用程序。 您認為學習和實施非常困難嗎? 我的回答是"否",因為當今有許多庫可用於實現如此強大的計算機視覺應用程序。 最近您看過2020 TensorFlow峰會嗎? 今年TensorFlow團隊為我們宣佈了很多很棒的事情。 在這裡,我們將看到如何使用tensorflow.js模型實現計算機視覺應用程序!
什麼是TensorFlow.js?
TensorFlow.js是一個開放源代碼庫,用於JavaScript中的機器學習應用程序和JavaScript中的Develop ML模型,並直接在瀏覽器或Node.js中使用ML。
什麼是Tensorflow.js模型?
Tensorflow.js模型是經過預訓練的模型,這意味著您無需準備/收集數據即可訓練模型。 這些模型託管在NPM和unpkg上,因此可以在任何開箱即用的項目中使用。
在此博客中,我們將看到tensorflow.js中的一個模型,即MediaPipe Facemesh模型。 該模型是為移動設備上的前置攝像頭而設計的,這些攝像頭中的人臉通常佔據畫布的相對較大部分。
Facemesh模型演示
我已經使用facemesh模型按照我的臉部移動來移動視頻幀。 請參見下面的演示。 讓我告訴您實現計算機視覺應用程序下面涉及的步驟。
示範
步驟1:-這是實現計算機視覺應用程序的三個重要的獨立腳本標記代碼。
<code>
/<code>
TensorFlow.js核心,用於神經網絡和數值計算的靈活的低級API。
TensorFlow.js Converter,用於將TensorFlow SavedModel導入TensorFlow.js的工具。
facemesh包可查找圖像中的面部邊界和界標。
步驟2:-在身體內容中包含視頻HTML標籤,以通過網絡攝像頭讀取面部。
<code><video>/<code>
步驟3:-使用canvas標記通過腳本(通常是JavaScript)動態繪製圖形。
<code><canvas>/<code>
步驟4:-在畫布標籤上包含一個視頻標籤以播放視頻幀,以根據面部移動來移動視頻幀。
<code><video>
<source>
/<video>/<code>
步驟5:-加載人臉模型並估算人臉,以找到圖像中的人臉邊界和界標。
<code>//load camera stream
const frame = document.getElementById("camera");
//load movie streamconst
movie = document.getElementById("movie");
movie.play();
//prepare canvas
const canvas = document.getElementById("augmented_canvas");
const draw = canvas.getContext("2d");
const result = await model.estimateFaces(frame, false);/<code>
步驟6:-使用以下代碼在檢測到的臉上繪製視頻幀。
<code>//copy camera stream 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]);
}
}/<code>
結論
就是這樣,我們已經按照上述六個步驟實施了計算機視覺應用程序。 您可以在此處獲取完整的源代碼。
所有人都說,如果您想成為一名數據科學家,您應該熟悉python或R編程語言,但是現在我們可以使用javascript實現機器學習應用程序。
祝大家學習愉快!! 如果您需要任何幫助或幫助,請與我聯繫LinkedIn和Twitter。
(本文翻譯自Bala Venkatesh的文章《Three lines of code to implement a computer vision application using Tensorflow.js》,參考:https://towardsdatascience.com/three-lines-code-to-implement-computer-vision-application-using-tensorflow-js-5a3a5e91f74a)
閱讀更多 聞數起舞 的文章