использую mapbox - крутой аналог гугл карт со стилизацией и вывожу на страницу карту земли где вся вода синняя, ибо поставлен такой слой
mapbox рисует слой поверх карты на canvas webgl элементе
задача - идентифицировать воду, тоесть синий цвет, в выбранном пикселе
решение к которому я прибегнул -
data = new Uint8Array(4);
ctxm.readPixels(mouse_x, mouse_y, 1, 1, ctxm.RGBA, ctxm.UNSIGNED_BYTE, data);
var [r, g, b, a] = data;
читаю цветовые данные пикселя в ргба формате с вебджл канваса
преобразую данные в hsv цветовую модель
rgb2hsv(r,g,b);
function rgb2hsv(r,g,b)
{
let v=Math.max(r,g,b), n=v-Math.min(r,g,b);
let h= n && ((v==r) ? (g-b)/n : ((v==g) ? 2+(b-r)/n : 4+(r-g)/n));
h=60*(h<0?h+6:h);
if ((h>169)&&(h<273)) {
console.log(h);
} else {
console.log(h,r,g,b);
}
var ifer;
if ((h>169)&&(h<273)){
ifer=false;
} else {
ifer=true;
}
return ifer;
}
особенность цветовой модели хсв состоит в том что идентификатор h обозначает градус на цветовом круге спектров, тоесть с его помощью можно идентифицировать спектр цвета
однако там где синипй цвет, порой программа его синим не видит, как и наоборот - порой видит там где не синий