You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Im to create a pattern with transparency within p5.js but using rasterised shapes slowed down the browser too much so I opted for p5.js-svg. Sadly I cannot figure out how to create a circular cutout.
Within standard p5 I would do this:
symbol = createGraphics(100,100);
symbol.fill('blue');
symbol.rect(0,0,100,100);
symbol.erase();
symbol.ellipse(50,50,80,80);
and then paste that Graphic over the canvas.
But using an SVG Graphics, erase() only makes the area white and not transparent. I also tried importing an svg and changing the fill attribute but can't seem to make that happen within a Graphics container.
Im to create a pattern with transparency within p5.js but using rasterised shapes slowed down the browser too much so I opted for p5.js-svg. Sadly I cannot figure out how to create a circular cutout.
Within standard p5 I would do this:
and then paste that Graphic over the canvas.
But using an SVG Graphics, erase() only makes the area white and not transparent. I also tried importing an svg and changing the fill attribute but can't seem to make that happen within a Graphics container.
I tried some things out within the sketch below but none of them work properly.
https://editor.p5js.org/lichtelucas/sketches/LYju8KThw
Thanks in advance!
The text was updated successfully, but these errors were encountered: