El gradiente lineal SVG se muestra de manera diferente por un software diferente cuando el atributo x2 no está presente


0

Recientemente importé y edité un archivo en Inkscape . Guardé la imagen como "SVG optimizado" en Inkscape, pero cuando abrí el archivo resultante en diferentes programas, algunos lo mostraban igual que Inkscape, mientras que otros no aplicaban un gradiente lineal particular (mientras que todas las otras partes de la imagen , incluidos los gradientes, funcionaban bien).

Hasta ahora para la historia de fondo. Condensé mi imagen original en un ejemplo mínimo y determiné qué parte de la fuente SVG hace que los diferentes espectadores se comporten de manera diferente. Este es mi archivo SVG de ejemplo:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" height="982" width="982" version="1.1"
 viewBox="0 0 982 982">
 <defs>
  <linearGradient id="a" gradientUnits="userSpaceOnUse"
   gradientTransform="matrix(-62.075 1070.8 1070.8 62.075 521.8 -42.09)">
   <stop stop-color="#bbb9c2" offset="0"/>
   <stop stop-color="#3f3" offset="1"/>
  </linearGradient>
 </defs>
 <path fill="url(#a)" d="m0 491.11c0 271.12 219.78 490.89 490.85 490.89 271.13 0 490.92-219.77 490.92-490.89 0-271.07-219.79-490.86-490.92-490.86-271.07 0-490.85 219.79-490.85 490.86"/>
</svg>

Así es como se ve en Inkscape y el visor de imágenes de GNOME ("Eye of GNOME") : ejemplo de imagen SVG en Inkscape u Eye of GNOME

Así es como se ve en los navegadores web Firefox y Chromium: ejemplo de imagen SVG en Firefox o Chromium

Sin embargo, noté que si agrega el atributo x2="1"al <linearGradient>elemento, la imagen se ve igual en todos estos visores .

Desafortunadamente, no estoy lo suficientemente familiarizado con los detalles del formato de archivo SVG y el estándar SVG , pero me parece claro que una de estas interpretaciones de mi archivo debe estar equivocada (es decir, viola el estándar) . ¿Alguien sabe de qué lado está bien (es decir, para qué programas debo presentar un informe de error)?


El estándar establece claramente que todos los x1, x2, y1 e y2 son opcionales y tienen valores predeterminados.
Juancho

Y parece que hay un error en el estándar, ya que los valores predeterminados son, respectivamente, 0%, 100%, 0% y 0% .
Juancho

1
@Juancho Aaah, ya veo. No hubiera esperado eso, pero si lo piensas, tiene sentido. Un vector de gradiente que es el vector nulo realmente no tiene sentido, por lo que no pueden establecer todos los valores predeterminados a 0%, y seleccionaron arbitrariamente un vector que apunta en la dirección x positiva. Así que no creo que sea un error en el estándar, sino en el software que no implementa estos valores predeterminados correctamente.
Socob

Respuestas:


0

De acuerdo, todavía no estoy completamente seguro de cuál de las dos representaciones es correcta, pero sospecho que es la que muestran los navegadores web porque he descubierto errores que afectan el comportamiento en mi ejemplo en Inkscape y Eye of GNOME (ver abajo).

Me he dado cuenta de la razón de la forma en que me hicieron conscientes de este problema, en primer lugar: El archivo SVG había abierto con Inkscape tenía una <linearGradient>con los atributos gradientUnits="userSpaceOnUse"y x2="1"(al igual que en mi ejemplo). Al guardar como "SVG optimizado", Inkscape "optimizó" el x2="1"atributo porque lo interpretó como equivalente a x2="100%", que es el valor predeterminado para el x2atributo especificado por el estándar SVG y, por lo tanto, podría omitirse. Sin embargo , la interpretación de Inkscape de x2="100%"x2="1"es (probablemente) incorrecta: este es el error de Inkscape # 1153706 .

En mi investigación sobre este tema, he encontrado varias inconsistencias en lo diferente software maneja gradientUnits="userSpaceOnUse"en combinación con los atributos del vector gradiente x1, x2, y1y y2. Los siguientes son informes de errores que ya existían o que yo mismo había presentado como resultado de mis hallazgos:

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.