select color and get value between 0 and 1

Programming Questions

clankill3r

select color and get value between 0 and 1

in Programming Questions • 2 months ago

first i used this to determine if a color is in range or not:

boolean colorInRange(color colorToTest, color targetColor, float fuzziness) {
float cr = red(targetColor);
float cg = green(targetColor);
float cb = blue(targetColor);
float maxOffset = 255*fuzziness;
float minR = cr-maxOffset;
float maxR = cr+maxOffset;
float minG = cg-maxOffset;
float maxG = cg+maxOffset;
float minB = cb-maxOffset;
float maxB = cb+maxOffset;
float r = red(colorToTest);
float g = green(colorToTest);
float b = blue(colorToTest);
return (r >= minR && r <= maxR && g >= minG && g <= maxG && b >= minB && b <= maxB );
}

Instead i want a value between 0 and 1. Where 1 will be when the colorToTest is equal to the targetColor.

I have this:

PImage img;
color targetColor = color(200, 0, 0);
float fuzziness = 0.1;
void setup() {
img = loadImage("img.png");
size(img.width, img.height);
img.loadPixels();
}
// . . . . . . . . . . . . . . .
void draw() {
image(img, 0, 0);
int x, y;
float v;
for (int i = 0; i < img.pixels.length; i++) {
x = i % img.width;
y = (i - x) / img.width;
v = colorInRangeValue(img.pixels[i], targetColor, fuzziness);
if (v > 0) {
set(x, y, color(v*255));
}
}
println(frameCount);
}
// . . . . . . . . . . . . . . .
void mouseClicked() {
targetColor = get(mouseX, mouseY);
}
// . . . . . . . . . . . . . . .
void mouseDragged() {
fuzziness = constrain(norm(mouseX, 0, width), 0, 1);
}
// . . . . . . . . . . . . . . .
// returns a value between 0 and 1
float colorInRangeValue(color colorToTest, color targetColor, float fuzziness) {
float targetRed = red(targetColor);
float targetGreen = green(targetColor);
float targetBlue = blue(targetColor);
float maxOffset = 255*fuzziness;
float minR = targetRed-maxOffset;
float maxR = targetRed+maxOffset;
float minG = targetGreen-maxOffset;
float maxG = targetGreen+maxOffset;
float minB = targetBlue-maxOffset;
float maxB = targetBlue+maxOffset;
/*
minR = constrain(minR, 0, 255);
maxR = constrain(minR, 0, 255);
minG = constrain(minR, 0, 255);
maxG = constrain(minR, 0, 255);
minB = constrain(minR, 0, 255);
maxB = constrain(minR, 0, 255);
*/
float r = red(colorToTest);
float g = green(colorToTest);
float b = blue(colorToTest);
// 0 ---------------------------------------------------------- 255
// ^ targetColor ^ colorToTest
// ^ minR ^maxR
// 0 1 0
// value red, value green, value blue
float vr, vg, vb;
if (r >= targetRed) {
//println(r+" "+maxR+" "+targetRed);
vr = norm(r, maxR, targetRed);
// println(vr);
}
else {
vr = norm(r, minR, targetRed);
}
if (g >= targetGreen) {
vg = norm(g, maxG, targetGreen);
}
else {
vg = norm(g, minG, targetGreen);
}
if (b >= targetBlue) {
vb = norm(b, maxB, targetBlue);
}
else {
vb = norm(b, minB, targetBlue);
}
// vr = constrain(vr, 0, 1);
// vg = constrain(vg, 0, 1);
// vb = constrain(vb, 0, 1);
float value = (vr + vg + vb ) / 3;
return value;
}
// . . . . . . . . . . . . . . . . .

Here i selected red with a certian fuzziness:

But when i uncomment (line 111 to 113):

vr = constrain(vr, 0, 1);

vg = constrain(vg, 0, 1);

vb = constrain(vb, 0, 1);

Then the result is way of, and i'm breaking my head why this is.

Can someone help me?

p.s. don't run the code in processing 2.0.1 on a retina screen, the result makes no sense then due how 2.0.1. works.

Replies(2)

clankill3r

Re: select color and get value between 0 and 1

2 months ago

this is what i wanted:

https://dl.dropboxusercontent.com/u/17630770/forum_images/processing/select_color_range.mov

I still dont understand the problem i had with the constrain.

Anyway, here is the solution:

PImage img;
color targetColor = color(250, 0, 0);
float fuzziness = 0.5;
void setup() {
img = loadImage("img4.png");
size(img.width, img.height);
img.loadPixels();
//noLoop();
}
// . . . . . . . . . . . . . . .
void draw() {
image(img, 0, 0);
int x, y;
float v;
if (!keyPressed) {
for (int i = 0; i < img.pixels.length; i++) {
x = i % img.width;
y = (i - x) / img.width;
v = colorInRangeValue(img.pixels[i], targetColor, fuzziness);
if (v > 0) {
set(x, y, color(v*255));
}
else {
set(x, y, color(0));
}
}
}
}
// . . . . . . . . . . . . . . .
void mouseClicked() {
targetColor = get(mouseX, mouseY);
println(red(targetColor)+"\t"+green(targetColor)+"\t"+blue(targetColor));
}
// . . . . . . . . . . . . . . .
void mouseDragged() {
fuzziness = constrain(norm(mouseX, 0, width), 0, 1);
println(fuzziness);
}
// . . . . . . . . . . . . . . .
// returns a value between 0 and 1
float colorInRangeValue(color colorToTest, color targetColor, float fuzziness) {
// version 02
if (fuzziness == 0) {
return colorToTest == targetColor ? 1 : 0;
}
float targetRed = red(targetColor);
float targetGreen = green(targetColor);
float targetBlue = blue(targetColor);
float maxOffset = 255*fuzziness;
float minR = targetRed-maxOffset;
float maxR = targetRed+maxOffset;
float minG = targetGreen-maxOffset;
float maxG = targetGreen+maxOffset;
float minB = targetBlue-maxOffset;
float maxB = targetBlue+maxOffset;
/*
minR = constrain(minR, 0, 255);
maxR = constrain(minR, 0, 255);
minG = constrain(minR, 0, 255);
maxG = constrain(minR, 0, 255);
minB = constrain(minR, 0, 255);
maxB = constrain(minR, 0, 255);
*/
float r = red(colorToTest);
float g = green(colorToTest);
float b = blue(colorToTest);
if (r >= minR && r <= maxR && g >= minG && g <= maxG && b >= minB && b <= maxB ) {
// 0 ---------------------------------------------------------- 255
// ^ targetColor ^ colorToTest
// ^ minR ^maxR
// 0 1 0
// value red, value green, value blue
float vr, vg, vb;
if (r >= targetRed) {
//println(r+" "+maxR+" "+targetRed);
vr = norm(r, maxR, targetRed);
//println(vr);
}
else {
vr = norm(r, minR, targetRed);
if (vr < 0) {
//println(r+"\t"+minR+"\t"+targetRed);
vr = 0;
}
}
if (g >= targetGreen) {
vg = norm(g, maxG, targetGreen);
}
else {
vg = norm(g, minG, targetGreen);
if (vg < 0) {
//println(r+"\t"+minG+"\t"+targetGreen);
vg = 0;
}
}
if (b >= targetBlue) {
vb = norm(b, maxB, targetBlue);
}
else {
vb = norm(b, minB, targetBlue);
if (vb < 0) {
//println(r+"\t"+minB+"\t"+targetBlue);
vb = 0;
}
}
//if(vr > 1 || vg > 1 || vb > 1) {
//print("!");
//}
// println(vr);
/*
vr = constrain(vr, 0, 1);
vg = constrain(vg, 0, 1);
vb = constrain(vb, 0, 1);
*/
//return (vr + vg + vb ) / 3;
float m = min(vr, vg);
m = min(m, vb);
return m;
}
return 0;
}
// . . . . . . . . . . . . . . . . .

kooogy

Re: select color and get value between 0 and 1

2 months ago

> I still dont understand the problem i had with the constrain.

i think you wanted map() rather than constrain(). map(), with the right arguments, would map the domain (input values) onto a fractional value between 0 and 1.

whereas constrain maps everything lower than the low value to the low value and everything higher than the high value to the high value. and leaves everything between them alone. it clips the values, basically.

http://processing.org/reference/map_.html
http://processing.org/reference/constrain_.html

Top Reply