# Move Pixels Based on Brightness

**URL:** <https://discourse.processing.org/t/move-pixels-based-on-brightness/22343>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [July 2, 2020, 11:32pm UTC](https://discourse.processing.org/t/move-pixels-based-on-brightness/22343 "2020-07-02T23:32:43Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![CKMJPEG](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/ckmjpeg/32/9899_2.png) [@CKMJPEG](https://discourse.processing.org/u/CKMJPEG)\
**Post date:** [July 2, 2020, 11:32pm UTC](https://discourse.processing.org/t/move-pixels-based-on-brightness/22343/1 "2020-07-02T23:32:43Z")

</div>

Hi Processing community. I am new to processing, but have used many scripts and am somewhat familiar with the interface and in thinking through the code.

My question is I would like to move the pixels of an image based on brightness values.

[https://processing.org/tutorials/pixels/](https://processing.org/tutorials/pixels/)

^ the last example on the page [Example: 2D image mapped to 3D] uses map to calculate a z position as a function of mouse X, but I would like the script to work off of an equation rather than it be interactive.

for example

if (br \< 120 || br \> 180) {

I would like the pixels either to move or not move - but I am not sure how to finish the code!

Here is the original examples code, I would deeply love and appreciate if anybody has any recommendations or solutions!

PImage img; // The source image  
int cellsize = 2; // Dimensions of each cell in the grid  
int cols, rows; // Number of columns and rows in our system

void setup() {  
size(200, 200, P3D);  
img = loadImage(“sunflower.jpg”); // Load the image  
cols = width/cellsize; // Calculate # of columns  
rows = height/cellsize; // Calculate # of rows  
}

void draw() {  
background(0);  
loadPixels();  
// Begin loop for columns  
for ( int i = 0; i \< cols;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\*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(img.pixels[loc]) - 100.0;  
// Translate to the location, set fill and stroke, and draw the rect  
pushMatrix();  
translate(x,y,z);  
fill©;  
noStroke();  
rectMode(CENTER);  
rect(0,0,cellsize,cellsize);  
popMatrix();  
}  
}  
}

![explode3](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/5d0be77eec1bde122be49e9c674228ec1fba12cb.jpeg)

---

<div class="post-metadata">

**Author:** ![CKMJPEG](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/ckmjpeg/32/9899_2.png) [@CKMJPEG](https://discourse.processing.org/u/CKMJPEG)\
**Post date:** [July 2, 2020, 11:36pm UTC](https://discourse.processing.org/t/move-pixels-based-on-brightness/22343/2 "2020-07-02T23:36:53Z")

</div>

Additionally, the end goal of the script I’m trying to write, I only would need to replace the movement of pixels with the mousex - maybe the problem is the map() ?