Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.12.2018, 17:46
Профессор
Отправить личное сообщение для Роман Андреевич Посмотреть профиль Найти все сообщения от Роман Андреевич
 
Регистрация: 12.08.2016
Сообщений: 218

Декодировать изображение и проверить прозрачен ли пиксель соответствующий точке
Коллеги, доброго времени суток, есть вопрос из ряда фантастики. Никогда не сталкивался но вот пришлось. Суть такая:

Пишу проект, интерактивная карта (на leaflet) на которою добавляю слои в виде картинок png. По сценарию юзер может выбрать область на карте, и в ней найти нужные объекты - участки земли. И так, область выбирается путем рисования прямоугольника, иными словами у нас есть координаты углов.

Далее я получаю координаты точек внутри прямоугольника и сохраняю их в массив. Встает проблема, при чесе массива получается от 1 до 5000 итераций, на каждой итерации отправляется запрос, приходит ответ и так далее. Результат запроса, объект и картинка, которую нужно наложить на карту по координатам, с этим то же все нормально. Вот пример:



Желтая собственно картинка которая приходит.



А это выделенный участок (маркеры для проверки, что точки расставились правильно).

Так вот, при первом запросе, нарисуется картинка, это png 256*256, и она квадратная. Но мне нужно из зоны загруженной картинки убрать точки. Что бы не было лишних запросов.

Но вот не задача!! картинка квадратная а фигура нет! можно исключить из периметра картинки точки, но из за того, что она квадратная исключаются и те точки, которые вне желтой фигуры.

Теперь вопрос, к знатокам, один умный человек, предложил декодировать изображение и проверить прозрачен ли пиксель соответствующий точке. Вопрос как это сделать??????

Буду благодарен за любые коменты по теме. Если не понятно что то написал, спрашивайте, все расскажу как есть....

p.s. возможности строить вектор нету, потому что данные приходят без координат углов этой желтой фигуры.
Ответить с цитированием
  #2 (permalink)  
Старый 06.12.2018, 21:16
Аватар для Alexandroppolus
Профессор
Отправить личное сообщение для Alexandroppolus Посмотреть профиль Найти все сообщения от Alexandroppolus
 
Регистрация: 25.10.2016
Сообщений: 582

Сообщение от Роман Андреевич
Теперь вопрос, к знатокам, один умный человек, предложил декодировать изображение и проверить прозрачен ли пиксель соответствующий точке. Вопрос как это сделать??????
canvas
getImageData
Ответить с цитированием
  #3 (permalink)  
Старый 07.12.2018, 00:44
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,386

ctx.getImageData(0,0,256,256)['data'].filter((el,i)=> i%4==3)[555]; //тут получаем все пиксели и фильтруем оставляя только альфаканал, потом обращаемся к пикселю который хотим проверить.

если проверок не много можно не фильтровать, альфа каждый 4 пиксель

Последний раз редактировалось j0hnik, 07.12.2018 в 01:12.
Ответить с цитированием
  #4 (permalink)  
Старый 07.12.2018, 06:55
Профессор
Отправить личное сообщение для Роман Андреевич Посмотреть профиль Найти все сообщения от Роман Андреевич
 
Регистрация: 12.08.2016
Сообщений: 218

Спасибо за направление, а можно пример хотя бы как это должно выглядеть:

структура следующая: leaflet генерирует карту и создает блоки в которых размещаются слои + canvas для векторов + слои jverlays тут и выводится слой с той самой желтой картинкой. Как в данных условиях проверить пиксели???

И к тому же все проверять не нужно. Из "картинки 2" видно что есть прямоугольник на котором маркеры стоят (они стоят для моей проверки, но по факту есть массив с координатами точек) на тех самых координатах из массива. Прямоугольник нарисован на canvas. Желтая картинка встанет поверх прямоугольника. Она как сказа квадратная, мне нужно убрать все точки именно с желтой фигуры. При чем координаты соответственно это долгота и широта, а не точки с экрана. У lealfet есть методы перевода x y в lat lng. Но если не сложно, знатоки, хотя бы пример как это выглядит покажите....\

Заранее благодарю...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как избежать ошибки по ограничению открытых файлов? Tipylja Node.JS 3 17.08.2018 20:43