How to judge whether it is in a certain color range after obtaining the color value of canvas

I would like to ask how I get the RGBA value of a color in canvas and how it matches the color in the specified color array.

I want to match the acquired colors with the colors in the array, and replace the acquired colors with similar colors!

is there any way I can give you some advice? It is not clear how to match! I don"t know how to find the approximate value!

Javascript canvas css

Mar.18,2021

calculate the color with the smallest distance. There are many algorithms for color distance. Please refer to Wikipedia

https://zh.wikipedia.org/wiki.

the simplest method is, of course, the spatial distance algorithm, which takes the square root of the following value:
(r2-r1) ^ 2 + (g2-g1) ^ 2 + (b2-b1) ^ 2

but the reality is that this "distance" is not consistent with the "distance" felt by the human eye. A better algorithm is to convert RGB to LAB before calculating. Of course, there is a better algorithm, please refer to the above documentation.

Previous: Is it normal for mobx to modify @ observable with ES6's setter stored value function?

Next: How an array generates a ladder nested array