PNG в Вектор SVG
Преобразуйте растровые изображения PNG и JPG в масштабируемую векторную графику SVG. Быстро и безопасно в вашем браузере.
Перетащите PNG/JPG сюда
До 50 МБ
Преобразуйте растровые изображения PNG и JPG в масштабируемую векторную графику SVG. Быстро и безопасно в вашем браузере.
До 50 МБ
Преобразование PNG в SVG — это, по сути, операция трассировки, а не изменение формата. PNG хранит пиксели; SVG хранит геометрические примитивы. Переход от пиксельной сетки к масштабируемым векторным путям требует интерпретации растрового изображения и рисования приближенных фигур вокруг областей одинакового цвета. Результат действительно масштабируем — вы можете свободно изменять размер без пикселизации — но это не идеальное воспроизведение источника. Фотографический контент плохо отслеживается, потому что каждое изменение цвета на уровне пикселей становится формой, создавая огромные SVG-файлы, которые противоречат цели. Логотипы, значки, штриховые рисунки и высококонтрастная графика отображаются четко, поскольку имеют небольшое количество цветовых областей с четко выраженными границами.
Этот конвертер использует библиотеку imagetracerjs — версию JavaScript алгоритмов трассировки векторов, аналогичную potrace. PNG декодируется в растровое изображение RGBA, растровое изображение сегментируется на цветовые области с использованием настраиваемой палитры, граница каждой области прорисовывается в путь, пути упрощаются с использованием аппроксимации Безье, а полученные пути создаются как элементы пути SVG. Весь конвейер работает в вашем браузере без какой-либо загрузки на сервер.
Параметры трассировки управляют компромиссом между точностью и размером файла. Больше цветов и более мелких деталей создают более крупный SVG, который более точно соответствует исходному; меньшее количество цветов и более грубая трассировка позволяют получить SVG меньшего размера с более стилизованным видом. По умолчанию настроены логотипы и значки; сложные изображения могут выиграть от трассировки с настроенными настройками или могут просто не подходить для векторизации.
Векторизация PNG наиболее полезна, когда вам нужно масштабировать изображение за пределы его исходного разрешения. Логотипы, в частности, часто создаются в формате PNG скромного размера и должны выглядеть четко на рекламных щитах, дисплеях Retina и широкоформатных отпечатках. Векторная трассировка создает SVG, который масштабируется без потери качества; компромиссом является точность воспроизведения исходных пикселей.
SVG также значительно компактнее PNG для графики с небольшим количеством цветов и большими плоскими областями. Значок PNG размером 256×256 может иметь размер 8 КБ; эквивалентный SVG с двумя или тремя цветами часто имеет размер менее 1 КБ. Для библиотек значков пользовательского интерфейса, поставляемых в веб-интерфейс, векторные версии уменьшают размер пакета и повышают резкость при любой плотности отображения.
Перетащите PNG, выберите настройки трассировки, создайте SVG.
imagetracerjs реализует многоэтапный конвейер: квантование цвета уменьшает растровое изображение до фиксированного количества цветов с помощью кластеризации k-средних или медианного разреза; обнаружение краев идентифицирует границы пикселей между областями; трассировка контуров следует границам для создания замкнутых многоугольников; Подгонка линий и кривых аппроксимирует полигоны кривыми Безье для сокращения данных о пути.
Наиболее важными параметрами алгоритма являются количество цветов (обычно: 4–32), pathomit (пути короче указанного количества пикселей отбрасываются как шум), ltres (допуск линии — насколько далеко край может отклоняться перед разделением на новый сегмент) и qtres (допуск квадратичной кривой — насколько агрессивно сглаживаются кривые). Значения по умолчанию хорошо подходят для логотипов; сложные изображения выигрывают от настройки каждого изображения.
Вывод — стандартный SVG 1.1 с элементами пути. Каждая цветовая область становится одним контуром с атрибутом заливки. Полученный файл откроется в любом браузере, векторном редакторе или инструменте дизайна, поддерживающем SVG. Размер файла зависит в первую очередь от количества путей и плотности узлов; типичный прорисованный логотип имеет размер 1–10 КБ.