Aller au contenu

SVG, des possibilités énormes et méconnues

Au risque de perdre la majorité des lecteurs passionnés uniquement par la vie quinocéenne, je vous propose encore un article technique sur le format SVG, dont j’essaie d’assimiler, avec beaucoup de difficultés, quelques éléments de syntaxe.
Un fichier SVG est constitué de lignes de code à la norme XML. Le XML est un langage de balises, indépendant de la plateforme et rédigé en mode texte, issu du SGML, comme le HTML, avec qui il partage certaines caractéristiques communes. Pour schématiser, un fichier SVG s’apparente à une page HTML, sauf qu’il fait partie de la page HTML en tant qu’objet.
Fort de cela, le SVG permet entre autres d’exécuter des animations légères, avec un code ouvert (ce qui m’a permis de traduire les indications en français), comme les horloges de Tavmjong Bah, toujours à l’heure :
Tavmjong Bah
mdhms
Malheureusement les deux navigateurs de Microsoft, que ce soit IE ou Edge (Windows 10) ont du mal à afficher certaines animations SVG contenant du JavaScript, comme cette magnifique horloge suisse “La Crosse” avec ombres portées dont vous ne verrez les aiguilles tourner qu’avec “Chrome” ou “Firefox”, et qui ne pèse que 33 952 octets:
La Crosse
Alors que l’insertion d’une image SVG statique peut se faire par une balise IMG, une image animée doit impérativement être adressée par la balise OBJECT, le code d’intégration de la pendule animée est donc :
<object data="/images/articles/clock.svg" type="image/svg+xml">

admin