Значения SVG и viewBox

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

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

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

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

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

спасибо за этот вопрос и то, как вы его задали. Это именно то, что мне было интересно, вплоть до PS внизу.
@Кори рад, что это помогло не только мне

Ответы (1)

Inkscape использует мм как единицу отображения по умолчанию или пользовательскую единицу для вашего документа. Пользовательские единицы используются для хранения значений в файле 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в свойствах документа (Файл > Свойства документа > Вкладка: Страница > Общие > Единицы отображения).

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

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

  1. Изменено: 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
Ух ты. Очень интересно. Так что в этом была рифма и причина. Большое спасибо за то, что поделились своими знаниями!
Я запомню технику белого тумана, которую вы использовали. Я обычно обвожу важные части скриншотов красными квадратами, ваш намного лучше.