Настройка
Как часть инструмента редактирования веб-векторов, написанного на Javascript, я реализую проверку попадания с использованием стратегии холста попаданий, аналогичной стратегии Бетон. js. По большей части это работает довольно хорошо: я рисую свои фигуры дважды (один раз на холсте дисплея и один раз на выбранном холсте).
При запросе холста я проверяю зависший пиксель нажмите на холст и извлеките информацию о взаимодействии (т.е. какой идентификатор объекта там хранится).
Проблема
Это хорошо работает внутри фигур, но имеет болезненные изъяны на границах, где сглаживание делает сохраненные данные недействительными (они смешиваются с любыми фоновыми данными, которые были там раньше). Есть ли хорошие стратегии для решения этой проблемы с границами данных?
Если не отключать сглаживание для методов холста, тогда мы обязательно получим некоторые граничные области в перекрывающихся регионах, в которых будут храниться объединенные данные из нескольких регионов.
Простой сценарий
В двоичном сценарии (некоторый передний план против фона), это может быть смягчено, поскольку мы можем предположить, что фон не имеет значения, а любое значение становится некоторым передним планом.
Реальный сценарий
Однако в общем сценарии с несколькими формами, перекрывающими друг друга поверх фона, есть ли разумная стратегия для обнаружения ошибок? (или ошибка исправление, но я предполагаю, что это сложнее)
Если я могу сказать, что данные недействительны (т.е. они состоят из искаженных данных из-за сглаживания), то я могу использовать другую стратегию для этих нескольких пикселей в границы. Но я чувствую, что невозможно определить, допустимы ли данные, которые я извлекаю, в общем сценарии, когда у нас может быть много перекрывающихся фигур.
Конечно, одно из решений - НЕ использовать холст совпадений. Но мне было интересно, нашли ли люди решение, используя популярные холсты, поскольку они кажутся отличными для работы со сложной геометрией. aliasing , что я не думаю, что это возможно для методов холста [*].
[*] Я знаю, что мы можем отключить фильтрацию при рендеринге изображений (например, этот вопрос ), например как с imageSmoothingEnabled=false
или изменение масштаба с помощью image-rendering: pixelated
, но это не решает проблему сглаживания при рисовании фигур / контуров.