I am developing a paint brush application in javascript using processing.js It is using a canvas object. I want to keep an image at the background of the canvas. Draw something in the foreground. And while saving i need to get only foreground data.
For that we need to make canvas object transparent so that background image is visible.
I don't see any option to make the canvas transparent. How do I do that?
Canvases are transparent by default. Try setting a page background image, and then put a canvas over it. If nothing is drawn on the canvas, you can fully see the page background. Think of a canvas as like painting on a glass plate.
Download designs with transparent backgroundsWith Canva Pro, simply choose PNG, then click the box with the transparent background option. Now you're ready to place your design anywhere –over other images, as branding on all your social posts, or even on a mug.
Even better, at the top of your pjs just put:
/* @pjs transparent=true; */
... and then in your draw loop:
background(0, 0, 0, 0);
voila!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With