ml5 Utilities

Illustration of hammer and wrench

Description

The ml5 utilities are handy functions that make your life easier when working with data, images, etc.

Usage

Methods

.flipImage()

Flips an image or video input horizontally and returns the flipped image. Handy for mirroring an image or video.

  1. const flippedImage = ml5.flipImage(input);

📥 Inputs

  • input: Optional. A HTMLVideoElement | p5 video element | HTMLImageElement.

📤 Outputs

  • Object: Returns a flipped image.

🌈Example

  • Assuming you’re using ml5 with p5.js:

    1. <html>
    2.   <meta charset="UTF-8" />
    3.   <title>flipImage</title>
    4.   <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.min.js"></script>
    5.   <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/addons/p5.dom.min.js"></script>
    6.   <script src="http://localhost:8080/ml5.js" type="text/javascript"></script>
    7.   <body>
    8.     <script>
    9.       let video;
    10.       function setup() {
    11.         createCanvas(640, 480);
    12.         video = createCapture(VIDEO);
    13.         video.size(640, 480);
    14.         video.hide();
    15.       }
    17.       function draw() {
    18.         const flippedVideo = ml5.flipImage(video);
    19.         image(flippedVideo, 0, 0, width, height);
    20.       }
    21.     </script>
    22.   </body>
    23. </html>

Source Code