Dessiner avec SVG

 

Dessiner avec SVG – sommaire

Introduction au SVG

Image vectorielle c’est quoi ?
Pourquoi apprendre le langage SVG ?
SVG et la cartographie

Les formes de base

Dessiner des rectangles
Dessiner des cercles
Dessiner des ellipses
Dessiner des lignes et des polygones

Les chemins

Notion de chemin
Les chemins : notation en relatif
Courbes de Bézier avec SVG
Les arcs elliptiques

Texte et image

Insérer du texte dans le canevas
Insérer une image matricielle dans le canevas

Quelques outils utiles

Le clonage
Les transformations
Rendre le canevas ‘responsive’ : viewBox
La balise SYMBOL

Effets graphiques

Les dégradés linéaire et radiaux
Les motifs – balise pattern
Les filtres SVG
Les outils masque et découpe

Produire du SVG interne avec Snap SVG

Découverte de la bibliothèque SnapSVG
Plus loin avec Snap SVG
Les filtres avec Snap SVG
Les dégradés avec Snap SVG
Chemins, masques & découpes en Snap SVG