using map(), easy question I think
in
Programming Questions
•
2 years ago
I want to control the fill of a circle using the position of the mouse, as the mouse gets closer to the circle, I want the fill to get closer to white. (all greyscale) In other words as the result of a dist() function gets closer to zero, the fill value will get closer to 255.
Right now I have the opposite happening in my patch, as the mouse gets closer the fill gets closer to 0.
I think that map offers a solution, but i can't get it to work.
Below is the code that i'm working with. Please help if you can.
int gridSize, radius; //gridsize is the diameter, among other things
int numCirc;
int cols, rows;
Circ[] grid;
void setup() {
size(500, 500);
smooth();
noStroke();
//noCursor();
background(0);
gridSize = width/10;
cols = width/gridSize;
rows = height/gridSize;
radius = gridSize/2;
numCirc = rows * cols; //because sq() won't work on an int
//numCirc = 2;
grid = new Circ[numCirc];//crate a new array of type Circ
int index = 0;
for(int j=0; j < rows; j++){
for(int k=0; k < cols; k++){
int x = j*gridSize;
int y = k*gridSize;
println("i="+index);
println("j="+j);
println("k="+k);
grid[index] = new Circ();
grid[index].start(x+radius, y+radius, gridSize, 255);
index++;
}
}
//grid[1] = new Circ(); //replace this with the for loop
}
void draw()
{
//background(0);
//grid[1].start(100, 100, 100, 255);
/* //debugger
println("gridSize: " + gridSize);
println("rows: " + rows);
println("columns: " + cols);
println("numCirc: " + numCirc);
*/
for(int i=0; i < numCirc; i++){
grid[i].update();
}
//grid[0].update();
}
class Circ {
int x, y;
int diameter;
int shade;
//constructor
void start(int xpos, int ypos, int dia, int sh) {
x = xpos;
y = ypos;
diameter = dia;
shade = sh;
fill(shade);
ellipse(x, y, diameter, diameter);
}
void update() {
//call the dist() function to get the distance from the mouseX, mouseY
//if distance is less than
float distance = dist(x, y, mouseX, mouseY);
//println(distance);
map(distance, 0, 255, 255, 0);
fill(distance);
ellipse(x, y, diameter, diameter);
}
}
1