Howdy, Stranger!

We are about to switch to a new forum software. Until then we have removed the registration on this forum.

color of shape in next piece of image

edited May 2015

Here is my code:

```PImage image;

int divideSize = 3;
Draggable[][] rects;

void setup() {

size(image.width, image.height);

int widthDelta = (int)Math.floor(image.width/divideSize);
int heightDelta = (int)Math.floor(image.height/divideSize);

rects = new Draggable[divideSize][divideSize];

int x = 0, y = 0;

for (int i=0; i < divideSize; i++) {

x = (i == 0) ? 0 : x+widthDelta;
y = 0;

for (int j=0; j < divideSize; j++) {

y = (j == 0) ? 0 : y+heightDelta;
rects[i][j] = new Draggable(x, y, image.get(x, y, widthDelta, heightDelta));

}
}
}

void draw() {

smooth();
noStroke();

//Loop through the array and call drag() and displayPoint() methods defined in Draggable Class

for (int i=0; i < divideSize; i++) {

for (int j=0; j < divideSize; j++) {

rects[i][j].rollover(mouseX,mouseY);
//rects[i][j].drag(mouseX, mouseY);
//rects[i][j].display();

if (rects[i][j].isRollover())
rects[i][j].displayPoint(mouseX, mouseY);
}
}
}

// Daniel Shiffman
// Tutorial: http://www.learningprocessing.com/examples/chapter-5/draggable-shape/
// Based on class for a draggable thing

class Draggable {
boolean rollover = false; // Is the mouse over the ellipse?

float x,y, pointillizeX, pointillizeY;          // Location and size
float offsetX, offsetY; // Mouseclick offset
int lx, ly;
PImage c; // shape image

Draggable(float tempX, float tempY, PImage imageC) {
x = tempX;
y = tempY;
offsetX = 0;
offsetY = 0;
c = imageC;
}

boolean isRollover() {
return rollover;
}

void displayPoint(int mywidth, int myheight) {
pointillizeX = map(mywidth, 0, c.width, 4, 15);

lx = floor(random(x, (x+c.width)));
ly = floor(random(y, (y+c.height)));

color pix = c.get(lx,ly);
fill(pix, 100);
ellipse(lx, ly, pointillizeX, pointillizeX);
}

// Method to display
void display() {
image(c,x,y,c.width,c.height);
}

// Is a point inside the rectangle (for rollover)
void rollover(int mx, int my) {
if (mx > x && mx < x + c.width && my > y && my < y + c.height) {
rollover = true;
} else {
rollover = false;
}
}

}
```

And here is a result:

Pointillism effect only in first piece of picture. Color in another pieces is always black, why? I would be grateful for any help.

Sorry for my bad English ((

• formating is fixed

• ``````image = loadImage("DSC03509.JPG");
``````

what is this? how big is the image? any other constraints?

• Nope. Image size 671x1024, but you can add your own. Image uzing for pointillist effect like here: https://processing.org/examples/pointillism.html

• `x = (i == 0) ? 0 : x+widthDelta;` (and the y equivalent) feels wrong.
I think it should be `x = x * widthDelta;` (or, more simply, `x *= widthDelta;`) to cover the whole image.

• Definitely not. I suppose that `pix = c.get(lx,ly);`for some reason does not return correct color.

• Indeed, because you have:

lx = floor(random(x, (x+c.width))); ly = floor(random(y, (y+c.height)));

Meaning that lx is a value between x and x + c.width, ie. that it can go way beyond the width of the image...

• Hmm.. x and y in class is always has top left coordinates of image segment in global 'image' coordinates, while c.height c.width has the same values as widthDelta and heightDelta (width and height of segment). I think everything is correct.

• Thank you all. Problem is solved: `pix = image.get(lx,ly);`

OK. I felt something fishy in this line... :-) Makes more sense now.