[SVG] Halbtransparente Flächen und Farbverläufe werden nicht (richtig) dargestellt

[Matthias27238120hq17]

Hallo zusammen,

ich habe folgende Probleme:

1. Farbverläufe werden beim Speichern als SVG gar nicht oder nicht korrekt dargestellt.

2. Halbtransparente Farbflächen werden nicht dargestellt.

Das heißt - werden sie sehr wohl, wenn ich beim Ausspielen die CSS-Eigenschaft "Stilattribute (Entitätsreferenzen)" verwende. Bei den drei anderen Optionen (Präsentationsattribute, Stilattribute und Stilelemente) funktioniert es leider nicht.

Das Irritierende: Genau diese Option ist mit dem Warnvermerk versehen, dass sie veraltet sei und in Zukunft entfernt werde.

Daher meine Frage:
Gibt es in Zukunft keine Möglichkeit mehr, Farbverläufe und halbtransparente Flächen für ein SVG zu verwenden? Das kann ich mir eigentlich nicht vorstellen.
Daher: Mit welcher Optionskombination lassen sich besagte Eigenschaften auch mit einer der drei zukunftssicheren Speichermethoden erzielen? Was habe ich bei meinen Kombinationsversuchen übersehen?

Vielen Dank für eure Hilfe.

[Monika Gause]

Um welche Art Verläufe handelt es sich? 

Könnte man dazu Demodateien haben? AI in PDF umbenennen, dann lassen die sich hier hochladen.

[Matthias27238120hq17]

Hm, gibt es da verschiedene Arten von Verläufen?
Leider kann ich die Datei hier nicht hochladen, da es sich um ein Kundenprojekt handelt und dieser nicht sehr begeistert davon wäre. 😉
Im Prinzip wird vermutlich auch ein neu angelegter Verlauf bzw. eine neutrale, halbtransparente Fläche ihren Dienst tun.
Dazu bräuchte es dann auch keine hochgeladene Datei.

(Zum Anlegen, Testen und Hochladen fehlt mir heute leider die Zeit. Sollte es keine weiteren Antworten hier geben, würde ich das aber natürlich tun.)

[Monika Gause]

Es gibt lineare, radiale und Freiformverläufe.

Ja, eine Demodatei wäre gut. 95% der Leute hier sind kein Adobe Staff, sondern Freiwillige.

[Matthias27238120hq17]

Sehr lästig!

Ich habe gerade eine neutrale Test-Datei erstellt - und (fast) alles hat beim Ausspielen als SVG tadellos funktioniert!
Nur der freie Verlauf wurde meist nicht richtig dargestellt; hier hat es nur mit der Einstellung "Präsentationsatrbute" geklappt.

Um der Ursache des problemlos auf die Spur zu kommen, habe ich mich deshalb doch entschlossen, die abgeänderten Original-Dateien hier hoch zu laden.

Bei der Kurve wurden sämtliche Hinweise auf ihre Bedeutung entfernt. Problematisch beim Ausspielen als SVG sind hier die halbtransparenten Farbflächen zwischen den Kurven.

Das zweiten Bild stellt eine Phase der Zellteilung dar und sollte ohne Sinnzusammenhang unverfänglich sein. Hier gehen beim Ausspielen als SVG die Verläufe auf den Chromosomen, den Vesikeln (die Kreise) und den Mitochondrien verloren bzw. verschieben sich.
Evtl. wichtig: Die Bilder der Zellteilung wurden uns als EPS-Dateien zur Verfügung gestellt und als solche in Illustrator importiert.

Der Vollständigkeit halber habe ich auch meinen neu erstellten SVG-Test mit hoch geladen.

[Matthias27238120hq17]

Verflixte Korrekturfunktion. Es soll natürlich "Problems" und nicht "problemlos" heißen. Gibt es hier keine Editierungsmöglichkeit? (Und ich schreibe diesen Zusatz nur, weil der Fehler den Sinn des geschriebenen zu sehr entstellt.)

[Anshul_Saini]

Hi @Matthias27238120hq17,

Thank you for providing detailed information and the test files—it’s very helpful!

•For Gradients: Try converting freeform gradients to linear or radial gradients before saving them as SVG. This ensures compatibility since freeform gradients are not universally supported in the SVG spec.

•For Transparency: Use “Style Attributes (Entity References)” for now if other methods don’t work as expected.

If that doesn't help, would you mind confirming the following:

• Are you encountering this behavior across all SVG viewers (e.g., multiple browsers, editors)?

• Have you tried rasterizing the problematic elements as a temporary workaround to preserve their appearance in SVG?

Feel free to share more insights; we’ll check with the Illustrator team.

Best regards,

Anshul Saini