![El gradiente lineal SVG se muestra de manera diferente según el software cuando el atributo x2 no está presente](https://rvso.com/image/1520694/El%20gradiente%20lineal%20SVG%20se%20muestra%20de%20manera%20diferente%20seg%C3%BAn%20el%20software%20cuando%20el%20atributo%20x2%20no%20est%C3%A1%20presente.png)
Recientemente importé y edité un archivo enpaisaje de tinta. 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 degradado lineal particular (mientras que todas las demás partes de la imagen , incluidos los degradados, funcionaban bien).
Hasta aquí la historia de fondo. Condensé mi imagen original en un ejemplo mínimo y determiné qué parte de la fuente SVG hace que 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 elVisor de imágenes de GNOME (“Ojo de GNOME”):
Así es como se ve en los navegadores web Firefox y Chromium:
Sin embargo, noté quesi 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 elestándar SVG, pero me parece claro queuna de estas interpretaciones de mi expediente debe ser incorrecta (es decir, viola el estándar). ¿Alguien sabe quién tiene razón (es decir, para qué programas debería presentar un informe de error)?
Respuesta1
Bien, 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 descubrí errores que afectan el comportamiento en mi ejemplo tanto en Inkscape como en Eye of GNOME (consulte abajo).
ItenerEn primer lugar, descubrí la razón por la que me avisaron de este problema: el archivo SVG que había abierto con Inkscape tenía <linearGradient>
los atributos gradientUnits="userSpaceOnUse"
y x2="1"
(como 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 x2
atributo.según lo especificado por el estándar SVGy por lo tanto podría omitirse.Sin embargo, la interpretación de Inkscape de x2="100%"
⇔ x2="1"
es (probablemente) incorrecta: esto esError de Inkscape #1153706.
En mi investigación sobre este tema, encontré varias inconsistencias sobre cómo los diferentes programas manejan gradientUnits="userSpaceOnUse"
en combinación con los atributos del vector de gradiente x1
, x2
y . Los siguientes son informes de errores que ya existían o que yo mismo presenté como resultado de mis hallazgos:y1
y2
- Paisaje de tinta –error n.° 1153706: “gradientUnits userSpaceOnUse usa una ventana gráfica incorrecta”
- fregar –error n.º 66: “Se perdió el gradiente en el trazado de recorte al optimizar con socavación”
- librsvg (utilizado por software GNOME como Eye of GNOME o GIMP) –error #778187: “SVG: propiedad x2 en gradientes manejados incorrectamente con gradientUnits="userSpaceOnUse"”
- ImagenMagick –“gradientUnits="userSpaceOnUse" se muestra incorrectamente”(Parece que ImageMagick ni siquiera tiene un rastreador de errores real…)