Masking - I want to get rid of the outside of the circle

Processing Coding Questions
2

Hello,

One way is using mask() with images:
https://processing.org/reference/PImage_mask_.html

Here is a simple template from the references:

// Masking
// v1.0.0
// GLV 2021-07-24

PGraphics pg1;
PImage img1;

void setup() 
  {
  size(330, 280);
  img1 = loadImage("frog.png");
  pg1 = createGraphics(330, 280); 
  }

void draw() 
  {
  background(0);

  pg1.beginDraw();
  //Your code for the mask goes here
  pg1.endDraw();
  
  img1.mask(pg1);
  
  image(img1, 0, 0);
  }

You will need to draw a circle with an alpha for transparency in your mask image.
I used a picture for img1 but this could also be another PGraphic for your bars.

This is the result (circle moved with mouse):

image

I provided some references here:
https://discourse.processing.org/t/i-want-to-masking/31382/2
See the UPDATE.

You will have to do some work with PGraphics to understand this approach.

I was also able to do this with this example:
https://processing.org/examples/brightness.html
You asked about this in another topic.

You already had two topics that are related to this that were homework.
I tagged this topic as homework.

You have a lot of blank lines in your posted code; these could be cleaned up to make code more readable for the community.

The rest is up to you.

Have fun!

:)