In deep learning, one of the most widely-used technologies is TensorFlow, an end-to-end open-source platform for building models. It has a vast, flexible ecosystem of tools, libraries, and community resources. With the power of TensorFlow, researchers and developers can develop and deploy ML-powered applications.
在深度学习中,使用最广泛的技术之一是TensorFlow,这是一个用于构建模型的端到端开源平台。 它具有广泛,灵活的工具,库和社区资源生态系统。 借助TensorFlow的力量,研究人员和开发人员可以开发和部署ML驱动的应用程序。
In this tutorial, we’re going to work with TensorFlow.js, TensorFlow’s JavaScript library. We’ll use this library to learn to perform object detection—and specifically, detect instances of people—using our device’s webcam. The idea is fairly simple. We launch the camera in observation mode. Then, when it detects a human, it starts to record the movement of the person until the person is no longer in the view of the camera.
在本教程中,我们将使用TensorFlowJavaScript库TensorFlow.js。 我们将使用该库来学习使用设备的网络摄像头执行对象检测 ,尤其是检测人员实例。 这个想法很简单。 我们以观察模式启动相机。 然后,当它检测到人时,它开始记录人的运动,直到该人不再在相机视野中。
For our object detection model, we are going to use the COCO-SSD, one of TensorFlow’s pre-built models. More on that next.
对于我们的对象检测模型,我们将使用TensorFlow的预构建模型之一COCO-SSD。 接下来的更多内容。
什么是COCO-SSD? (What is COCO-SSD?)
COCO-SSD is an object detection model powered by the TensorFlow object detection API. SSD is an acronym from Single-Shot MultiBox Detection. This model has the ability to detect 90 Class in the COCO Dataset. It makes use of large scale object detection, segmentation, and a captioning dataset in order to detect the target objects.
COCO-SSD是由TensorFlow对象检测API支持的对象检测模型。 SSD是Single-Shot MultiBox Detection的首字母缩写。 该模型具有检测COCO数据集中的90类的能力。 它利用大规模的对象检测, 分段和字幕数据集来检测目标对象。
Now that we have some context for our project, let’s get started!
现在我们有了项目的上下文,让我们开始吧!
导入和配置 (Imports and Configurations)
First, we need to import the libraries required for this tutorial—React and TensorFlow:
首先,我们需要导入本教程所需的库-React和TensorFlow:
import React, { useRef, useEffect, useState } from "react";
import ReactDOM from "react-dom";
import * as cocoSsd from "@tensorflow-models/coco-ssd";
import "@tensorflow/tfjs";
Next, we need to create a functional component with a new variable, as shown in the code snippet below:
接下来,我们需要使用新变量创建一个功能组件,如下面的代码片段所示:
const App = () => {
const [rec, setRec] = useState([]);
const video = useRef(null);
const startBtn = useRef(null);
const stopBtn = useRef(null);
const willRec = useRef(false);
const model = useRef(null);
const recnow = useRef(false);
const recorderRef = useRef(null);
Here, the component name is App
, which is the main component itself, and the s