I'm trying to use tracking.js for color detection. I'm testing the code locally, and can replicate the example results when using the sample image provided in the tracking.js live demo.
I can also add a new color and get the tracker to identify the fourth bulb in that sample:
tracking.ColorTracker.registerColor('#8CF0BE', function(r, g, b) {
if (r < 150 && g > 225 && b < 200) {
return true;
}
return false;
});
But when I swap out the default image on my local test page with the one below (which is from an unrelated but excellent SO post, nothing at all gets highlighted/boxed.
Image by Mecanismo, via Wikimedia Commons. Used under the CC BY-SA 3.0 license.
I'm specifically trying to get the switch to light up, with this color definition:
tracking.ColorTracker.registerColor('orangered', function(r, g, b) {
if (r > g && r > b) {
return true;
}
return false;
});
I used a digital color meter to determine that all the switches in the pixel have red values in the 150-200 range, green values in the 30-100 range, and blue values in the 10-100 range (and mostly not the high ends of those scales).
For what it's worth, I know the custom color definition itself isn't completely broken, because it does have an effect on that initial sample image:
What am I doing wrong or not understanding here?