How can I extend the context to add globalcompositeoperation = 'destination-out'?

p5.js Coding Questions
1

I’m trying to create a draw with pencil and eraser. I really want to make use of setting the context in Render2D.globalcompositeoperation = ‘destination-out’ in order to create an erasing the line behavior. How would I go about doing that? Any hints towards the proper direction would be much appreciated.

2

I don’t know if that property is meant to be accessed through Processing, but have you checked out blendMode()?

In fact, I think blendMode() was implemented through globalCompositeOperation, looking at this Github issue

Maybe @lmccart can speak more to this?

Edit: Okay, I realize I didn’t actually answer the question.

If we want a simple, MSPaint eraser, we could draw an ellipse, filled with the background-color, wherever the mouse is.

If we wanted to get fancy, we could store the ‘pencil marks’ in a PGraphic, and draw an ellipse filled with a color with 0 alpha onto the PGraphic using blendMode(REPLACE).

2 Likes