Javascript.RU

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

Анализ SVG изображения
Добрый день.
Такой вопрос у меня: Имеется некая SVG картинка на фоне. Необходимо вставлять круги поверх изображения, но при условии, что если круг пересекается с некоторым объектом SVG, он обрезается по этот объект.
Центр круга не может располагаться на объекте.
Пример:

Круги размещает пользователь
Update: По сути, мне нужен способ нахождения пересечения линий (лучи из центра круга), с объектами. Дальше уже разобраться легко.

Последний раз редактировалось Bu3r, 03.04.2017 в 14:26.
Ответить с цитированием
  #2 (permalink)  
Старый 04.04.2017, 06:47
Профессор
Отправить личное сообщение для SV0L0CH Посмотреть профиль Найти все сообщения от SV0L0CH
 
Регистрация: 07.11.2010
Сообщений: 301

Надо разделить объекты изображения на фоновые и передний план.
Сначала идет фон, потом передний план, а между ними <svg:g/> в который и вставляются твои круги.
И не надо никакой геометрии.
Ответить с цитированием
  #3 (permalink)  
Старый 04.04.2017, 12:02
Новичок на форуме
Отправить личное сообщение для Bu3r Посмотреть профиль Найти все сообщения от Bu3r
 
Регистрация: 03.04.2017
Сообщений: 3

В таком случае круги не будут обрезаться под "угол обзора", а просто ложиться слоем ниже.

Грубо говоря: у меня есть схема/карта местности. и точка это человек, так вот - кругами нужно показать обзорную видимость из точки. Все объекты - это стены.

Мне не нужен полный код, мне нужен способ определения точек, возможно и через канву (я не силен вообще в js)

Последний раз редактировалось Bu3r, 04.04.2017 в 12:10.
Ответить с цитированием
  #4 (permalink)  
Старый 04.04.2017, 14:25
Профессор
Отправить личное сообщение для SV0L0CH Посмотреть профиль Найти все сообщения от SV0L0CH
 
Регистрация: 07.11.2010
Сообщений: 301

Конечно отрисовка в канве векторной графики с последующим извлечением цвета даст результат, однако для этой самой отрисовки понадобится сторонняя библиотека и использование растровой картинки весьма ресурсоёмко.
Если нужен алгоритм определения попадает ли объект в область видимости, то лучше распределить все объекты по квадратам размером радиуса видимости, потом фильтровать объекты для отрисовки и стены по попаданию в пределы окружности, потом отфильтровать их по непопаданию за стены методом полного перебора актуальных стен. Если стены состоят из отрезков, то написать такой алгоритм не составит проблем. Для всяких там сплайнов надо будет искать формулы. Хотя и сплайны можно заменить ломаными, если отклонения не критичны.
Ответить с цитированием
  #5 (permalink)  
Старый 06.04.2017, 09:04
Новичок на форуме
Отправить личное сообщение для Bu3r Посмотреть профиль Найти все сообщения от Bu3r
 
Регистрация: 03.04.2017
Сообщений: 3

Сделал методом перегона svg на канву и определение цвета. Да, действительно - ресурсоемкая задача. Если в хроме все впорядке, то у ФФ возникают проблемы и подвисание на 5-20 сек при обсчете области (вернее анализе каждого пиксела).

Не совсем понимаю смысл по распределению по квадратам.
Стены - это объекты "path" их как то можно перевести в сплайны? Или лучше изначально все нарисовать полигонами?
Ответить с цитированием
  #6 (permalink)  
Старый 06.04.2017, 14:05
Профессор
Отправить личное сообщение для SV0L0CH Посмотреть профиль Найти все сообщения от SV0L0CH
 
Регистрация: 07.11.2010
Сообщений: 301

Полигоны - набор отрезков, следовательно к ним применим описанный мной алгоритм. Ну а куда их пихать в <path/> или <polygon/> или <line/> - не суесвенно.
Кроме того я не знаю хранятся данные у тебя уже в виде SVG и их надо доставать или SVG только взиализирует их. Из всех вариантов <path/> самый неудобный для парсинга.
Так как всё сводится к проверке пересекается ли отрезок от точки до центра с хотя бы одной из стен, то стены в виде набора отрезков предпочтительней в плане реализации этой самой проверки.
Ну а оптимизации по скорости стоит отложить на потом, они актуальны только когда карта значительно превышает область видимости.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как лучше подключать SVG объект Black_Star (X)HTML/CSS 0 02.12.2016 00:09
SVG, спрятать часть изображения SV0L0CH Элементы интерфейса 0 18.05.2014 18:12
SVG CSS, SVG to WOFF kobezzza Firefox/Mozilla 2 29.03.2013 15:59
Расчет реальных размеров изображения в галерее Vision Элементы интерфейса 7 10.07.2012 21:56
Inline SVG as background Paguo-86PK Элементы интерфейса 0 16.12.2011 20:12