Solo tengo curiosidad si alguien sabe cómo se determinan los viewBox
valores (es decir viewBox="a b c d"
).
Estoy tratando de entender la funcionalidad SVG de Inkscape, así que lo que hice fue crear un documento en Inkscape que es 100px
x 100px
, dibujé una línea desde el lado izquierdo de la ventana gráfica (es decir 0
, valor horizontal) hacia el lado derecho (es decir 100
, valor horizontal) .
Sin embargo, extrañamente, cuando guardo este documento como un archivo SVG simple y luego abro el archivo en un editor de texto, los viewBox
valores se establecen en viewBox="0 0 26.458333 26.458334"
lugar de, digamos, viewBox="0 0 100 100"
.
¿Alguien sabe cómo se determinan estos valores ( 0 0 26.458333 26.458334
) y por qué aparentemente no hay relación entre ellos y las dimensiones de la ventana gráfica?
PD: sé que puede editar la viewBox
propiedad manualmente en las opciones del documento, pero todavía tengo curiosidad por saber por qué Inkscape los establece en valores funky.
Inkscape utiliza mm como unidad de visualización o unidad de usuario predeterminada para su documento. Las unidades de usuario se utilizan para almacenar valores en el archivo SVG.
<svg width="100" height="100" viewBox="0 0 26.458333 26.458333">
Esta etiqueta describe un tamaño de dibujo de 100px x 100px
. El atributo viewBox define que 100px x 100px
es equivalente a 26.458333 x 26.458333 user units
.
El factor de escala SVG sería 1px / 0.2645 user-unit
, que puede ser utilizado por un renderizador SVG para convertir todos los valores almacenados en unidades de usuario a las dimensiones del dibujo del mundo real .
En este caso, Inkscape quiere almacenar los valores en mm
, por lo que debe saber cómo px
se relaciona con mm
. La especificación CSS describe que las unidades de longitud absoluta se fijan entre sí:96px = 1in
Esto significa100px = 1.041666667in = 2.645833333cm = 26.45833333mm
Así que de ahí 26.45833333
viene.
Si desea que Inkscape almacene todos sus valores en px
, puede cambiar las unidades de visualización o las unidades de usuariopx
predeterminadas en las propiedades del documento (Archivo > Propiedades del documento > Pestaña: Página > General > Unidades de visualización)
Exportar el mismo documento dará como resultado la siguiente etiqueta SVG:
<svg width="100" height="100" viewBox="0 0 100 100">
Ahora el factor de escala SVG es 1px / 1 user-unit
.
Si quieres saber más sobre este tema, hay una explicación más detallada en Inkscape Wiki
Observaciones:
96px/in
, Inkscape v0.91 y versiones anteriores usaban un valor de90px/in
corey
chico mayor