Entdecken Sie die aufregenden neuen Funktionen in SVG 2

SVG 2 bietet viele Verbesserungen, von Klarstellungen zur Interoperabilität über benutzerfreundliche Vereinfachungen bis hin zu neuen Funktionen. In diesem Artikel werde ich einige der wichtigsten Änderungen erläutern, die Sie beachten sollten.

Fehlerbehebung

Zunächst einmal enthält SVG 2 basierend auf Ihren Berichten zu Rendering- und Leistungsproblemen Dutzende von Fehlerkorrekturen für Dinge, die in verschiedenen Browsern nicht auf die gleiche Weise funktionierten - zum Beispiel Transformationen im SVG-Stammverzeichnis und die Größe von SVG in HTML. Diese Korrekturen sind nicht aufregend, erleichtern jedoch das konsistente Authoring erheblich.

Da wir gerade davon sprechen, die Verwendung von SVG zu vereinfachen, haben wir Funktionen mit CSS und HTML harmonisiert - wie das Entfernen von XLink Namespace auf Links (gute Befreiung!) und Laden externer Stylesheets mit a Element - und SVG auf das Wesentliche reduziert. Außerdem haben wir CSS hinzugefügt Z-Index sowie automatisches Umbrechen von Text mit der bekannten CSS-Syntax. Kein langwieriges manuelles Textlayout mehr.



  • So implementieren Sie SVG-Symbole

Aber der Game-Changer ist, dass die meisten geometrischen Attribute von SVG - wie x , Y. , r (Radius) und d (die Pfadbeschreibung) wurden jetzt zu CSS-Eigenschaften heraufgestuft. Dies bedeutet, dass Sie Ihre SVG-Formen in CSS definieren und animieren können. Für die Integration in HTML definiert SVG 2 neue Sicherheits-, Datenschutz- und Interaktivitätsmodi, und wir importieren die , , und