Scribd Logo
Upload

Welcome to Scribd!

  • 7 views

    K234101317 Teachable Machine

    Uploaded by

    Như Ý
    This document loads an image classification model from Teachable Machine and sets up a webcam to perform live predictions. It loads the model and metadata files, initializes the webcam, appends the webcam video and label elements to the DOM, then enters a prediction loop to continuously classify the webcam frames and update the label probabilities. Each frame is passed through the model to predict the classes and probabilities, which are then displayed next to the webcam video.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd

    K234101317 Teachable Machine

    Uploaded by

    Như Ý
    7 views1 page
    This document loads an image classification model from Teachable Machine and sets up a webcam to perform live predictions. It loads the model and metadata files, initializes the webcam, appends the webcam video and label elements to the DOM, then enters a prediction loop to continuously classify the webcam frames and update the label probabilities. Each frame is passed through the model to predict the classes and probabilities, which are then displayed next to the webcam video.

    Original Title

    K234101317_Teachable_Machine

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document loads an image classification model from Teachable Machine and sets up a webcam to perform live predictions. It loads the model and metadata files, initializes the webcam, appends the webcam video and label elements to the DOM, then enters a prediction loop to continuously classify the webcam frames and update the label probabilities. Each frame is passed through the model to predict the classes and probabilities, which are then displayed next to the webcam video.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    7 views1 page

    K234101317 Teachable Machine

    Uploaded by

    Như Ý
    This document loads an image classification model from Teachable Machine and sets up a webcam to perform live predictions. It loads the model and metadata files, initializes the webcam, appends the webcam video and label elements to the DOM, then enters a prediction loop to continuously classify the webcam frames and update the label probabilities. Each frame is passed through the model to predict the classes and probabilities, which are then displayed next to the webcam video.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    of 1

    // https://github.

    com/googlecreativelab/teachablemachine-community/tree/master/libraries/image

    // the link to your model provided by Teachable Machine export panel


    const URL = "./https://teachablemachine.withgoogle.com/models/8TeY-6kjR//";

    let model, webcam, labelContainer, maxPredictions;

    // Load the image model and setup the webcam


    async function init() {
    const modelURL = URL + "model.json";
    const metadataURL = URL + "metadata.json";

    // load the model and metadata


    // Refer to tmImage.loadFromFiles() in the API to support files from a file picker
    // or files from your local hard drive
    // Note: the pose library adds "tmImage" object to your window (window.tmImage)
    model = await tmImage.load(modelURL, metadataURL);
    maxPredictions = model.getTotalClasses();

    // Convenience function to setup a webcam


    const flip = true; // whether to flip the webcam
    webcam = new tmImage.Webcam(200, 200, flip); // width, height, flip
    await webcam.setup(); // request access to the webcam
    await webcam.play();
    window.requestAnimationFrame(loop);

    // append elements to the DOM


    document.getElementById("webcam-container").appendChild(webcam.canvas);
    labelContainer = document.getElementById("label-container");
    for (let i = 0; i < maxPredictions; i++) { // and class labels
    labelContainer.appendChild(document.createElement("div"));
    }
    }

    async function loop() {


    webcam.update(); // update the webcam frame
    await predict();
    window.requestAnimationFrame(loop);
    }

    // run the webcam image through the image model


    async function predict() {
    // predict can take in an image, video or canvas html element
    const prediction = await model.predict(webcam.canvas);
    for (let i = 0; i < maxPredictions; i++) {
    const classPrediction =
    prediction[i].className + ": " + prediction[i].probability.toFixed(2);
    labelContainer.childNodes[i].innerHTML = classPrediction;
    }
    }</script>

    You might also like