SVG

Les graphiques vectoriels évolutifs (SVG) permettent d’ajouter des éléments visuels évolutifs et très fidèles (petits et simples ou grands et complexes) à un site Web sans qu’un plug-in ou une visionneuse séparé soit nécessaire.Windows Internet Explorer 9 prend désormais en charge le jeu de fonctionnalités SVG de base, basé sur la recommandation de la spécification SVG 1.1 (Deuxième édition) (pour les navigateurs de bureau).

La fonctionnalité suivante a été mise en œuvre :

  • Une grande partie de la structure de document SVG, l’interactivité (événements de script) et les styles (inline et via CSS)
  • De nombreux éléments de présentation et leurs attributs et interfaces DOM, notamment :
    • formes de base
    • remplissage, trait, marqueur, couleur
    • dégradés et motifs
    • tracés
    • texte

Internet Explorer 9 prend en charge les méthodes suivantes pour afficher le balisage SVG :

  • Fragments SVG en incorporation HTML5, sans utilisation d’objet étranger (simple inclusion d’une balise <svg> au sein du code HTML)
  • SVG en tant que type de document (avec une extension de fichier .svg)
  • SVG en XML ou XHTML (identique à la méthode HTML5, uniquement avec des fichiers XML ou XHTML)
  • SVG en tant qu’image CSS
  • SVG utilisant l’élément object, comme dans l’exemple suivant (notez les attributs type, height et width) :
    
    <object data="rect2.svg" width="100%" height="400px"
        type="image/svg+xml"></object>
    
    
  • SVG utilisant les éléments img, embed, iframe ou frame, comme ci-après :
    
    <embed id="Smiley" src="smiley.svg" type="image/svg+xml">
    
    

Dans cette section

Informations de référence sur les API

Scalable Vector Graphics (SVG)

Exemples et didacticiels

Transformations de coordonnées SVG
Animation SVG de base
Animation SVG de niveau intermédiaire
Animation SVG avancée
Comment ajouter un rendu SVG à une page Web
Comment faire un zoom et un panoramique avec SVG
Comment choisir entre les technologies SVG et Canvas
Exemples d’utilisation de SVG et de l’élément canvas

Démonstrations du site Internet Explorer Test Drive

Atlas zur Europawahl 2004 in Deutschland
Hands on: SVG Filter Effects
Real-world Diagrams
SVG Dice
SVG–oids

Billets IEBlog

Meilleures pratiques pour débuter avec SVG
Effets du filtre SVG dans IE10
Quand utiliser Canvas et SVG
SVG Open 2011 : quand SVG rencontre le Web
Comparaison de l’accélération matérielle SVG entre navigateurs avec Santa’s Workshop
En savoir plus sur SVG
Prêt pour SVG Open ?
En attendant SVG 2.0 : rapport du groupe de travail SVG en face à face
Feuille de route SVG dans IE9

Spécification

Scalable Vector Graphics (SVG) : Dégradés et motifs

Rubriques connexes

Comment écrire un jeu BrikBloc avec la technologie SVG et l’élément canvas HTML5

 

 

Afficher:
© 2014 Microsoft