-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix example links from ima_ml to ml5 tm example (#202)
* fix example links from ima_ml to ml5 tm example * Matching the example iframe with the web editor example --------- Co-authored-by: Alan Ren <[email protected]>
- Loading branch information
Showing
4 changed files
with
37 additions
and
34 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,49 +1,51 @@ | ||
| // Classifier Variable | ||
| /* | ||
| * 👋 Hello! This is an ml5.js example made and shared with ❤️. | ||
| * Learn more about the ml5.js project: https://ml5js.org/ | ||
| * ml5.js license and Code of Conduct: https://github.com/ml5js/ml5-next-gen/blob/main/LICENSE.md | ||
| * | ||
| * This example demonstrates detecting objects in a live video through ml5.imageClassifier + Teachable Machine. | ||
| */ | ||
|
|
||
| // A variable to initialize the Image Classifier | ||
| let classifier; | ||
| // Model URL | ||
| let imageModelURL = "https://teachablemachine.withgoogle.com/models/4-WUyljZZ/"; | ||
|
|
||
| // Video | ||
| // A variable to hold the video we want to classify | ||
| let video; | ||
| // To store the classification | ||
| let label = ""; | ||
|
|
||
| // Load the model first | ||
| // Variable for displaying the results on the canvas | ||
| let label = "Model loading..."; | ||
|
|
||
| let imageModelURL = "https://teachablemachine.withgoogle.com/models/bXy2kDNi/"; | ||
|
|
||
| function preload() { | ||
| classifier = ml5.imageClassifier(imageModelURL + "model.json", { | ||
| flipped: true, | ||
| }); | ||
| ml5.setBackend('webgl'); | ||
| classifier = ml5.imageClassifier(imageModelURL + "model.json"); | ||
| } | ||
|
|
||
| function setup() { | ||
| createCanvas(320, 260); | ||
| // Create the video | ||
| createCanvas(640, 480); | ||
|
|
||
| // Create the webcam video and hide it | ||
| video = createCapture(VIDEO, { flipped: true }); | ||
| video.size(320, 240); | ||
| video.size(640, 480); | ||
| video.hide(); | ||
|
|
||
| // Start detecting objects in the video | ||
| classifier.classifyStart(video, gotResult); | ||
| } | ||
|
|
||
| function draw() { | ||
| background(0); | ||
| // Draw the video | ||
| // Each video frame is painted on the canvas | ||
| image(video, 0, 0); | ||
|
|
||
| // Draw the label | ||
| fill(255); | ||
| textSize(16); | ||
| textAlign(CENTER); | ||
| text(label, width / 2, height - 4); | ||
| } | ||
|
|
||
| // Get a prediction for the current video frame | ||
| function classifyVideo() { | ||
| classifier.classify(flippedVideo, gotResult); | ||
| // Printing class with the highest probability on the canvas | ||
| fill(0, 255, 0); | ||
| textSize(32); | ||
| text(label, 20, 50); | ||
| } | ||
|
|
||
| // When we get a result | ||
| // A function to run when we get the results | ||
| function gotResult(results) { | ||
| // The results are in an array ordered by confidence. | ||
| // console.log(results[0]); | ||
| // Update label variable which is displayed on the canvas | ||
| label = results[0].label; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters