/tensorflow-js-smart-webcam

Built during a Google I/O 2021 workshop

Primary LanguageJavaScriptApache License 2.0Apache-2.0

Based on Code Lab: https://codelabs.developers.google.com/codelabs/tensorflowjs-object-detection#0

Created during Google I/O Workshop: https://events.google.com/io/session/8472f8a3-619a-47cb-b606-8a451175a344?lng=en

Tensorflow.js Smart Webcame

Uses Tensorflow.js to recognize objects captured by the webcam.

Built Using TensorFlow.js Boilerplate

This very simple skeleton simply loads in TensorFlow.js and prints out the version once loaded to the DOM.

From these humble beginnings you can do some really great things.

Feel free to fork this and use it as a quick way to start coding with TensorFlow.js directly or following some other tutorial that needs TensorFlow.js to run.

Your Project

← index.html

We simply have a script tag in our HTML to grab the latest version of TensorFlow.js

In this case we simply reference the following:

<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs/dist/tf.min.js" type="text/javascript"></script>

However, if you want to pull in a particular version of TensorFlow.js you can do so like this:

<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.4.0/dist/tf.min.js" type="text/javascript"></script>

Optionally, if you want to include our TF.js visualization library you can do so using this import:

<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-vis/dist/tfjs-vis.umd.min.js" type="text/javascript"></script>

However feel free to remove if you are not using this for visualizing training etc. More details here.

← style.css

Nothing to see here. Just styles to make the demo look prettier. You can use or ignore these as you please.

← script.js

This simply grabs a reference to a paragraph in the DOM and then prints out the TensorFlow.js version number to it once loaded.