• Ressources

Expérimentez avec le SVG grâce au framework Paper.js

Publié le
Expérimentez avec le SVG grâce au framework Paper.js

Un des grands changements de ces prochaines années sur le Web sera sans doute une generalisation de l'utilisation du SVG. Léger, dynamique et responsive, les seuls gros freins de cette technique étaient le support navigateur et une mise en place un peu trop complexe pour la plupart des intégrateurs.

Pour ce qui est du support navigateur, avec 97.13% des navigateurs français supportant le SVG, nous sommes maintenant prêt pour son utilisation à grande échelle. Pour ce qui est de la simplicité, en revanche, il reste encore un peu de travail pour tout ce qui n'est pas de la "simple" visualisation de données. Heureusement, des frameworks SVG tendent à se démocratiser, comme Paper js.

Le Framework SVG Paper.js

Paper js est un outil qui simplifie l'utilisation du SVG, et permet de faire des choses assez impressionnantes avec un minimum de connaissances et efforts.

L'exemple suivant, par exemple, ne prend qu'une petite centaine de lignes à mettre en place (vous pourrez voir son code source grâce au bouton "source" en haut à droite de la page d'exemple).

Évidemment, Paper Js reste encore un peu brut pour un intégrateur n'ayant aucune connaissance en Javascript, mais il simplifie tout de même grandement la tache, et permet à toute personne ayant envie de se pencher dessus d'apprendre avec un minimum d'effort.

Quelques autres exemples

Paper.js propose toute une liste d'exemples que je vous propose d'aller voir. Le code source est disponible avec un simple clic sur le bouton en haut à droite de chaque exemple.

 

By Benjamin Sanchez

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *