Математика полутонов на Canvas: от допечатной подготовки к интерактивной геометрии

Кармен Ансио перенес алгоритмы старой допечатной подготовки в браузер, реализовав честный эффект полутонов на HTML Canvas. Вместо привычных CSS-фильтров, имитирующих шум, здесь работает прямая математическая конвертация яркости пикселя в радиус точки.

Архитектура эффекта построена на строгом разделении сетки и графических примитивов. Отрисовка конкретной формы вынесена в независимый вызов drawShape, что позволяет менять паттерн без пересчета геометрии. Для интерактивности при наведении курсора применяется функция Гаусса вместо стандартного линейного затухания. Она убирает жесткие границы свечения и создает плавный переход, где угол от курсора определяет оттенок элемента.

Базовый расчет дистанции Math.hypot также применяется для создания фазовой задержки в трехмерном пространстве. Расстояние от точки клика становится смещением в синусоиде, заставляя сетку растра работать как физический движок. Элементы реагируют с выверенной задержкой, формируя корректное распространение волны с привязкой цвета к высоте подъема каждого отдельного узла.