Значения SVG и viewBox


14

Мне просто любопытно, если кто-нибудь знает, как определяются viewBoxзначения (то есть viewBox="a b c d").

Я пытаюсь понять функциональность SVG в Inkscape, поэтому я создал документ в Inkscape 100pxразмером x 100px, нарисовал линию от левой стороны области просмотра (т.е. 0горизонтальное значение) к правой стороне (т.е. 100горизонтальное значение) ,

Странно, однако, что когда я сохраняю этот документ в виде простого SVG-файла, а затем открываю файл в текстовом редакторе, вместо него, скажем, viewBoxустанавливаются значения .viewBox="0 0 26.458333 26.458334"viewBox="0 0 100 100"

Кто-нибудь знает, как определяются эти значения ( 0 0 26.458333 26.458334) и почему, по-видимому, нет никакой связи между ними и размерами области просмотра?

PS Я знаю, что вы можете редактировать viewBoxсвойство вручную в параметрах документа, но мне все еще любопытно, почему Inkscape устанавливает для них значения в стиле фанк.

Ответы:


19

Inkscape использует mm в качестве единицы отображения по умолчанию или пользовательской единицы для вашего документа. Пользовательские единицы используются для хранения значений в файле SVG.

<svg width="100" height="100" viewBox="0 0 26.458333 26.458333">

Этот тег описывает размер рисунка 100px x 100px. Атрибут viewBox определяет, что 100px x 100pxэквивалентно 26.458333 x 26.458333 user units.

Был бы масштабный коэффициент SVG 1px / 0.2645 user-unit, который может использоваться средством визуализации SVG для преобразования всех значений, хранящихся в пользовательских единицах, в реальные размеры чертежа.


В этом случае Inkscape хочет сохранить значения mm, поэтому он должен знать, как к ним pxотносится mm. Спецификация CSS описывает, что единицы абсолютной длины фиксированы относительно друг друга:96px = 1in

Это означает 100px = 1.041666667in = 2.645833333cm = 26.45833333mm

Так вот откуда 26.45833333.


Если вы хотите , Inkscape , чтобы хранить все ваши ценности в px, вы можете изменить настройки по умолчанию для отображения единиц или пользователей-единиц , чтобы pxв свойствах документа (Файл> Свойства документа> вкладка: страница> Общие> Display Units)

  1. По умолчанию, мм:

Свойства документа, мм

  1. Изменено: px:

Свойства документа px

Экспорт того же документа приведет к следующему тегу SVG:

<svg width="100" height="100" viewBox="0 0 100 100">

Теперь SVG масштабный коэффициент равен 1px / 1 user-unit.

Если вы хотите узнать больше об этом предмете, есть более подробное объяснение в Inkscape Wiki

Примечания:

  • Inkscape v0.92 использует отношение 96px/in, Inkscape v0.91 и ранее использовали значение90px/in

Вау. Очень интересно. Так что была рифма и причина для этого. Большое спасибо за то, что поделились своими знаниями!
oldboy

Я запомню технику отключения, которую вы использовали. Обычно я поставил красные квадраты вокруг важных частей скриншотов, ваше это так гораздо лучше.
аааааа
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.