Add files via upload

burakberber · web-flow · commit cd97b52e3d7e · 2019-12-06T01:14:21.000+03:00
diff --git a/index.html b/index.html
@@ -0,0 +1,19 @@
+<html>
+  <head>
+    <!-- Load the latest version of TensorFlow.js -->
+    <script src="https://unpkg.com/@tensorflow/tfjs"></script>
+    <script src="https://unpkg.com/@tensorflow-models/mobilenet"></script>
+    <script src="https://unpkg.com/@tensorflow-models/knn-classifier"></script>
+
+  </head>
+  <body>
+    <div id="console"></div>
+    <!-- Add an image that we will use to test -->
+    <video autoplay playsinline muted id="webcam" width="224" height="224"></video>
+    <button id="class-a">Add A</button>
+<button id="class-b">Add B</button>
+<button id="class-c">Add C</button>
+    <!-- Load index.js after the content of the page -->
+    <script src="index.js"></script>
+  </body>
+</html>
diff --git a/index.js b/index.js
@@ -0,0 +1,63 @@
+const classifier = knnClassifier.create();
+
+const webcamElement = document.getElementById('webcam');
+
+let net;
+
+async function app() {
+    console.log('Loading mobilenet..');
+  
+    // Load the model.
+    net = await mobilenet.load();
+    console.log('Successfully loaded model');
+  
+    // Create an object from Tensorflow.js data API which could capture image 
+    // from the web camera as Tensor.
+    const webcam = await tf.data.webcam(webcamElement);
+  
+    // Reads an image from the webcam and associates it with a specific class
+    // index.
+    const addExample = async classId => {
+      // Capture an image from the web camera.
+      const img = await webcam.capture();
+  
+      // Get the intermediate activation of MobileNet 'conv_preds' and pass that
+      // to the KNN classifier.
+      const activation = net.infer(img, 'conv_preds');
+  
+      // Pass the intermediate activation to the classifier.
+      classifier.addExample(activation, classId);
+  
+      // Dispose the tensor to release the memory.
+      img.dispose();
+    };
+  
+    // When clicking a button, add an example for that class.
+    document.getElementById('class-a').addEventListener('click', () => addExample(0));
+    document.getElementById('class-b').addEventListener('click', () => addExample(1));
+    document.getElementById('class-c').addEventListener('click', () => addExample(2));
+  
+    while (true) {
+      if (classifier.getNumClasses() > 0) {
+        const img = await webcam.capture();
+  
+        // Get the activation from mobilenet from the webcam.
+        const activation = net.infer(img, 'conv_preds');
+        // Get the most likely class and confidences from the classifier module.
+        const result = await classifier.predictClass(activation);
+  
+        const classes = ['A', 'B', 'C'];
+        document.getElementById('console').innerText = `
+          prediction: ${classes[result.label]}\n
+          probability: ${result.confidences[result.label]}
+        `;
+  
+        // Dispose the tensor to release the memory.
+        img.dispose();
+      }
+  
+      await tf.nextFrame();
+    }
+  }
+
+app();
