Alpha Mask
Loads a "mask" for an image to specify the transparency in different parts of the image. The two images are blended together using the mask() method of p5.Image.
To run this example locally, you will need two image files, and a running local server.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
let img;
let imgMask;
function preload() {
img = loadImage('assets/moonwalk.jpg');
imgMask = loadImage('assets/mask.png');
}
function setup() {
createCanvas(720, 400);
img.mask(imgMask);
imageMode(CENTER);
}
function draw() {
background(0, 102, 153);
image(img, width / 2, height / 2);
image(img, mouseX, mouseY);
}