Topic: imageData test for yellow tones and orange tones (Page 1 of 1)

I'm using a function that gets the pixel color of the mouse coords on the canvas and switches the opacity on colors that are within a sensitivity range. The problem I have is I need to figure a better way to apply the sensitivity based on what color the mouse is on.
http://www.hardwoodfloorspdx.com/misc/javascript/canvas/test/mouse.html
I'm wondering if anyone has ever had to solve this problem before and has some insight.
I used paint.net to mess with the original image, which is from Open Street. I made the orange into red to make the script work the way I would like orange to work.
The problem with the original image was only the exact color will highlight.
http://mobilegeo.wordpress.com/

My fix has both yellow and orange highlighting together if I added a large sensitivity but only partial orange colors would highlight if it was small sensitivity.

I really want to figure out is a way to change all the pixels near a certain color into the that color. For example, change all orangish colors into orange and all yellowish colors into yellow.


Can anyone recommend a method to do this? It has to have been done? No?

You need to design a curve that will represent the distance from the color of interest. Normalize that distance and you've got your opacity level.

Here's what I got so far. I managed to at least change the right pixels to the color I set.
Thanks for your help, poi.

I made a test of the imagedata and changed anything close to orange into bright orange.

My question is, is this a clumsy way to do it? I don't really know what you mean by a curve. I'm good with math, but unfortunately, I'm untrained, so I lack the knowledge of simple names of methods which you are correct to figure I ought to know. I apologize for this.

Can you tell me if i'm on the right track? Is this what you mean?
http://www.hardwoodfloorspdx.com/misc/javascript/canvas/test/mouse2.html


Or can you point me to a wiki so I can fill in yet another gap in my knowledge?

maybe it would be easier to calculate hue from rgb and then decide on tolerance

http://en.wikipedia.org/wiki/Hue#Computing_hue_from_RGB

I managed to make it do what I was trying to do, which is highlight the colors of the open source street maps.
http://www.hardwoodfloorspdx.com/misc/javascript/canvas/test/mouse3.html

Edit by mr.maX: Removed spam.

(Edited by mr.maX on 03-30-2010 20:43)