Please help to incorporate third image into the existing coding
in
Programming Questions
•
1 year ago
Hi guys,
I'm asking for some help again.
I have a code, which amasing Chrisir ( http://forum.processing.org/user/chrisir) helped me with.
'Mouse horizontal location controls breaking apart of image and Maps pixels from a 2D image1 into 3D space using image2 as a mapping guide.
Pixel brightness of image2 controls translation of image1 along z axis.'
In other words when I apply this code for two images
Pixels of image1 that situated in the same positions where the brighter pixels of image2 are, comes up. So image2 becomes a 'map' of positions for the pixels of image1.
That's how this code works at the moment. What I need to do is to incorporate third image into this code (image3).
Image3 looks like a pattern of black or white cells.
The size of all 3 images is the same.
I need black cells of image3 not to show, and white cells to grow and create white lines (rays) behind image1. The length of the white rays should be determined by the same 'z' mapped by image 2.
This is an illustration of this idea.
Please help guys to change the existing coding to be able to do that.
I'm really really looking forward to hearing from you.
Thank you.
I'm asking for some help again.
I have a code, which amasing Chrisir ( http://forum.processing.org/user/chrisir) helped me with.
-
PImage img; // The source image
PImage img2; // declare it
int cellsize = 2; // Dimensions of each cell in the grid
int columns, rows; // Number of columns and rows in our system
void setup() {
size(750, 500, P3D);
img = loadImage("img1.jpg"); // Load the image
img2 = loadImage("img2.jpg"); // load it
columns = img.width / cellsize; // Calculate # of columns
rows = img.height / cellsize; // Calculate # of rows
}
void draw() {
background(0);
// Begin loop for columns
for ( int i = 0; i < columns; i++) {
// Begin loop for rows
for ( int j = 0; j < rows; j++) {
int x = i*cellsize + cellsize/2; // x position
int y = j*cellsize + cellsize/2; // y position
int loc = x + y*img.width; // Pixel array location
color c = img.pixels[loc]; // Grab the color
// Calculate a z position as a function of mouseX and pixel brightness
float z = (mouseX / float(width)) * brightness(img2.pixels[loc]) - 20.0; // use it
// Translate to the location, set fill and stroke, and draw the rect
pushMatrix();
translate(x + 200, y + 100, z);
fill(c, 204);
noStroke();
rectMode(CENTER);
rect(0, 0, cellsize, cellsize);
popMatrix();
}
}
}
'Mouse horizontal location controls breaking apart of image and Maps pixels from a 2D image1 into 3D space using image2 as a mapping guide.
Pixel brightness of image2 controls translation of image1 along z axis.'
In other words when I apply this code for two images
Pixels of image1 that situated in the same positions where the brighter pixels of image2 are, comes up. So image2 becomes a 'map' of positions for the pixels of image1.
That's how this code works at the moment. What I need to do is to incorporate third image into this code (image3).
Image3 looks like a pattern of black or white cells.
The size of all 3 images is the same.
I need black cells of image3 not to show, and white cells to grow and create white lines (rays) behind image1. The length of the white rays should be determined by the same 'z' mapped by image 2.
This is an illustration of this idea.
Please help guys to change the existing coding to be able to do that.
I'm really really looking forward to hearing from you.
Thank you.
1
