Как создать растровые изображения и SVG для вывода в HTML?

Как создать растровые изображения и SVG для вывода в HTML?

Ниже приведены примеры вызовов для создания растровых изображений. Растровые изображения уже оптимизированы для 100 и 300 dpi. Вы можете загружать эти изображения «на лету» в браузер через динамически создаваемый файл растрового изображения (имя файла на основе случайного значения/метки времени). В качестве альтернативы можно также использовать векторную графику в формате SVG.

tbarcode -fIMAGE -iGIF -oBarcode.gif -b8 -m0.254 --dpi=100 -d"1234567890ABC"

tbarcode -fIMAGE -iPNG -oBarcode.png -b112 -m0.508 --dpi=300 -d"www.tec-it.com"

Оптимизация качества:

• Ширина модуля (наименьший графический элемент кода) уже была подогнана под пиксельную сетку в растровом изображении. При 100 dpi 0,254 мм соответствует ровно одному пикселю, при 300 dpi — 3 полным пикселям (поэтому эффектов квантования или ошибок округления нет). При 300 dpi размер точки 0,508 мм соответствует 6 полным пикселям (снова без эффектов квантования).
• Можно также указать целевое значение ширины модуля -m (или общую ширину -w) и использовать внутреннюю оптимизацию через параметр --optimalwidth. При этом штрихкод может оказаться меньше целевого значения, поскольку всегда округляется вниз до целых пикселей.
• При отображении и печати учитывается разрешение дисплея и принтера. В зависимости от dpi возможны ошибки округления.

tbarcode -fSVG -oBarcode.svg -b112 -m0.762 -d"https://www.tec-it.com"

Векторный формат SVG также поддерживается, и большинство браузеров уже умеют его отображать. В формате SVG у нас также есть строка обычного текста для 1D-кодов.

Интеграция в HTML:

С форматом SVG можно либо загрузить SVG через тег <img src="svg-url">, как и с растровым изображением, либо напрямую встроить его в HTML как узлы <svg> (дополнительная загрузка изображения не требуется). Для встраивания inline пропустите первую строку нашего файла SVG — вам нужен только узел <svg>. Размер отображения (viewBox) также может иметь значение.