Changing the behavior of colors in Processing

General Discussion Other

dlillard5

Changing the behavior of colors in Processing

in General Discussion • Other • 3 months ago

So I was browsing through Simon Page's work the other day in search of some inspiration for some sketches on my own, when I noticed a particular technique that he had used in several of his works that I wanted to recreate.
An example of the technique that I am talking about is below.

It appears that when a shape's fill is drawn on top of existing color from other shapes etc. the color is changed into a new color instead of simply overriding the previous color. That's kind of wordy but it makes sense if you just look at the picture.

Anyways, I was wondering if anyone had any idea of how this could be done in Processing.

Replies(2)

Mushussu

Re: Changing the behavior of colors in Processing

3 months ago

You have to iterate each point of the window to test if he is inside into one or more circle like this :

ArrayList<Circle> circles;
int standardDiameter = 200;
PImage drawing;
void setup() {
size(800, 800);
circles = new ArrayList<Circle>();
drawing = createImage(width, height, RGB);
}
void draw() {
background(255);
drawing.loadPixels();
for (int x = 0; x < width; x++) {
for (int y = 0; y < height; y++) {
PVector pointVect = new PVector(x, y);
int cRed = 0;
int cGreen = 0;
int cBlue = 0;
int counter = 0;
for (int i = 0; i < circles.size(); i++) {
Circle circ = circles.get(i);
if (pointVect.dist(circ.position) < circ.diameter) {
counter++;
cRed += red(circ.c);
cGreen += green(circ.c);
cBlue += blue(circ.c);
}
}
if (counter > 0) {
drawing.pixels[y * width + x] = color(cRed / counter, cGreen / counter, cBlue / counter);
} else {
drawing.pixels[y * width + x] = color(255);
}
}
}
drawing.updatePixels();
image(drawing, 0, 0);
}
void keyPressed() {
if (key == ' ') {
Circle newCircle = new Circle(new PVector(mouseX, mouseY), standardDiameter);
circles.add(newCircle);
}
}
class Circle {
PVector position;
int diameter;
color c;
Circle( PVector _position, int _diameter) {
position = _position;
diameter = _diameter;
c = color(random(0, 255), random(0, 255), random(0, 255));
}
}

dlillard5

Re: Changing the behavior of colors in Processing

3 months ago

Yeah that is definitely one solution to the problem, and I could probably use that solution to recreate something similar to what was shown in the picture, so thanks.

However, if I wanted to start doing the same thing with other shapes and lines and such it seems like I would basically be rewriting code that already exists in processing (such as circles, lines, PShape...) which I don't want to do and probably wouldn't be able to do well.

Does anyone know how to edit Processing's existing 2d libraries somehow? If I could somehow change the section(s) of the source code where points are rendered to "change color" (maybe adding the hues of the colors and then %255-ing them) instead of "overriding color" (just rendering on top of the existing pixel) then I could probably make a lotta cool sketches.

Top Reply