copist
@copist
Мидл, хочешь стать синьором? http://copi.st/ExhE

Чем упростить иконку SVG для генерации веб-шрифта?

Сижу уже пятый месяц над задачей упрощения файлов SVG так, чтобы их сервис icomoon.io/app понимал и делал из SVG буковки в веб-шрифте.

Текущее решение реализовано на Adobe Illustrator и работает просто чудовищно нестабильно.

Вот моя проблемная иконка: wifi_logo.svg

Вот что я получаю, если загрузить её в icomoon.io/app/ — take.ms/HpEWu — из неё пропадают все линии, у которых задан атрибут stroke. Иногда и другие элементы теряются, но я пока завис именно над stroke.

Вот что я хотел бы получить — take.ms/0Ppv3 — вся фигура переведена в кривые, затем объединена в один сложный путь.

Эту иконку я получил путём ручной обработки в Inkscape. Я выполнил операции «ungroup» + «object to path» + «stroke to path» последовательно над всеми объектами, затем выполнил операцию «union». Вот что получилось wifi_logo_simplified.svg
Вот так видит эту иконку icomoon.io take.ms/ftvc4 — результат замечательный.

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

Я пытался прикинуть, помогут ли мне FabricJS, RaphaëlJs, Snap.SVG, SVG.js, но квалификации не хватает.

Подскажите, в каком направлении двигаться.
  • Вопрос задан
  • 2779 просмотров
Решения вопроса 1
copist
@copist Автор вопроса
Мидл, хочешь стать синьором? http://copi.st/ExhE
Даю ответ на свой вопрос.

Я сделал упрощатель "любых" SVG. Под "любыми" подразумевается тестовая выборка из почти 7000 иконок от нашей компании icons8.com - ни одного сбоя, все как на подбор. Тестовая выборка отличается тем, что все иконки в flatstyle. С другой стороны, я не видел ни одного веб-шрифта с многоцветными иконками.

Работает на связке двух утилит, работающих в консольном режиме под Centos:


Если позволят мои друзья по имени Альтруизм, Время и Честолюбие, я сделаю специальную страницу для аплоада пользовательских файлов SVG в стиле flatstyle и преобразованию в упрощённые. А тут уже прямой путь к веб-шрифтам.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Aingis
@Aingis
Всё гениальное — просто.
Фигура и так довольно сложная, 2 КБ после SVGO (с округлением до одного знака после запятой) — уже неплохо. Можно оптимизировать кружочки, используя дуги a (я люблю делать что-то вроде «a1 1 0 1 1 .1 0»), а так, кажется, и без того достаточно упрощено.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Stream Labs Москва
До 150 000 ₽
Myagi Минск
от 3 000 до 4 000 $
Salesbeat Москва
от 150 000 до 250 000 ₽
17 февр. 2020, в 23:30
1100 руб./за проект
17 февр. 2020, в 19:40
500 руб./за проект
17 февр. 2020, в 19:36
5000 руб./за проект