In P5.js how to draw within the constraint of an image

p5.js Coding Questions
1

I intend to draw some dots within the constraint of the outline of an image. Currently I only know how to mask shape with another shape (using ( imgClone = img.get() ).mask( mask.get() )), or image with another image, but couldn’t find info on how to make a shape with an image (or irregular SVG shapes beyond circle/rect/etc). Appreciate any help

2

the dots can be found via random like x = random(img.x, img.x+img.width);
and y = similar

you can connect the dots with beginShape vertex… endShape

3

Something like this? Code here.

5 Likes
4

this looks good. thanks @noel!