Using Mask in processing.js
-
15-11-2019 - |
Question
I'm pretty new with Processing.js and I was wondering why this simple mask is not working? I mean, I can display the image and the mask without any problem, but as soon as it reach the line img1.mask(mask1);
everything stop working.
/* @pjs preload="resources/images/1.jpg, resources/images/masks/1.jpg"; */
void draw(){
PImage img1 = loadImage("resources/images/1.jpg");
PImage mask1 = loadImage("resources/images/masks/1.jpg");
img1.mask(mask1);
image(img1, 0, 0);
}
I have read http://processingjs.org/reference/PImage_mask_/, but I don't see what i'm doing wrong :S Anyone have an idea ? Thanks
Solution
I've tried your code from jsfiddle and it's working with Processing.js 1.3.6.
Note that you have to run it from a web server, opening the html file from the filesystem will give you the blank canvas in Chrome or just the text in Firefox.
If you don't have an access to a web server you can install one on your own computer (XAMPP is good and multiplatform, I personally use WAMP on Windows)
OTHER TIPS
The code is actually working great, but only in Processing, not in Processing.js even though this fonctionnality appear in both reference pages http://processingjs.org/reference/PImage/