diff --git a/examples/p5js/UNET/UNET_Image/assets/test.png b/examples/p5js/UNET/UNET_Image/assets/test.png new file mode 100644 index 000000000..f6e15d4f8 Binary files /dev/null and b/examples/p5js/UNET/UNET_Image/assets/test.png differ diff --git a/examples/p5js/UNET/UNET_Image/index.html b/examples/p5js/UNET/UNET_Image/index.html new file mode 100644 index 000000000..3ee359873 --- /dev/null +++ b/examples/p5js/UNET/UNET_Image/index.html @@ -0,0 +1,14 @@ + + + + UNET example with p5.js + + + + + + +

UNET Image example using p5.js

+ + + \ No newline at end of file diff --git a/examples/p5js/UNET/UNET_Image/sketch.js b/examples/p5js/UNET/UNET_Image/sketch.js new file mode 100644 index 000000000..441530f43 --- /dev/null +++ b/examples/p5js/UNET/UNET_Image/sketch.js @@ -0,0 +1,51 @@ +// Copyright (c) 2022 ml5 +// +// This software is released under the MIT License. +// https://opensource.org/licenses/MIT + +/* === + ml5 Example + UNET Image example using p5.js +=== */ + +let video; +let uNet; +let segmentationImage; + +// load uNet model +function preload() { + uNet = ml5.uNet('face'); +} + +function setup() { + createCanvas(320, 240); + + // load up your image + img = createImg("assets/test.png", imageReady); + img.hide(); + + //create blank image + segmentationImage = createImage(width, height); + frameRate(1); +} + +function imageReady(){ + console.log('Image ready'); + + uNet.segment(img, gotResult); +} + +function gotResult(error, result) { + // if there's an error return it + if (error) { + console.error(error); + return; + } + // set the result to the global segmentation variable + segmentationImage = result.backgroundMask; +} + +function draw() { + background(0) + image(segmentationImage, 0, 0, width, height); +} \ No newline at end of file