How Can I crop an image in processing js with javascript?

Processing Coding Questions
1

How Can I crop an image in processing js with javascript ?

2

I would start by googling something like “javascript crop image” for a ton of results. Then I’d put together a MCVE that tries it out in a simple example program.

3

Got this image round crop sketch in Java Mode. Should be easy to convert it to p5js or pjs: :wink:

4

Take a look at a sample program on github:

PImage originalImage;
PImage croppedImage = createImage(200, 200, RGB);

void setup() {

size(800, 533);
originalImage = loadImage(“church.jpg”);
}

void draw() {
image(originalImage, 0, 0); // display the church on the screen
croppedImage = originalImage.get(mouseX, mouseY, 100, 100);
image(croppedImage, width/2, height/2);

}

void mouseClicked(){
croppedImage.save(“croppedImage.png”);
}