5 ressources et frameworks pour travailler avec HTML5 Canvas

Le 15/06/2017

Dans Développement

Besoin de travailler avec Canvas, mais sans savoir par où démarrer ? Aujourd'hui le BlogDuWebdesign vous propose de découvrir une liste de ressources et Frameworks pour vous simplifier le travail.

 

CanvasQuery

Si vous ne connaissez pas Canvas et que vous cherchez par où commencer, c'est votre jour de chance ! Pas la peine de lire la suite de l'article, portez votre choix sur canvasQuery.

La particularité de CanvasQuery est qu'il est très proche de la syntaxe normale de canvas, et est même totalement compatible avec cette dernière. Tout ce qu'il apporte est plus de souplesse et de praticité a travailler avec Canvas, ainsi qu'une documentation claire, bien que malheureusement assez peu complète. Pas de gestion du clavier, de la souris, ou autre, juste le nécessaire.

 

Canvasquery

Fabric.js

Fabric.js est une library Canvas un peu spéciale, dans le sens ou son objectif final semble être l'interactivité avec l'utilisateur, presque comme s'il s'agissait d'un WYSIWYG graphique.

Allez voir l'exemple sur la page principale de la documentation, un exemple est souvent bien mieux que tous les discours.

 

Fabricjs

 

Stage.js

Stage.js est une library pour laquelle j'ai des sentiments assez ambivalents. Très séduisante de prime abord pour sa gestion de l'affichage et des transformations (les rotations principalement, les vrais savent à quels points ces dernières sont la purge intersidérale en canvas), son API sous la forme d'une classe Singleton met vraiment mes nerfs à rude épreuve.
De plus, si vous espériez une documentation en bonne et due forme, vous pouvez tout de suite oublier, ici toute information se trouvera au forceps en lisant des exemples ou directement le code source.

Néanmoins, après un petit peu de travail de wrapping, il est vraiment possible de faire quelque chose avec une API plutôt agréable je trouve. Si le sujet vous intéresse, quelques articles vont suivre !

 

Stagejs

Three js

 

Three js est un peu bas dans cette liste, situation assez dommage pour ce qui est ni plus ni moins que le boss du game en matière de 3D Web. Efficace, puissant, rapide, il n'a que des avantages… Paraît-il.

Je ne l'ai personnellement pas touché (la 2D m'enchante plus, que voulez-vous) donc je n'ai pas d'avis de première main à donner dessus.

 

Threejs

 

Isomer

Attention, la library Isomer semble abandonnée. Elle n'a pas eu la moindre mise à jour depuis près de deux ans, et son auteur ne semble pas chercher de mainteneur. Utilisez la donc à vos risques et périls.

Isomer est une library canvas faite pour travailler la 3D isométrique. Simple d'accès et permettant des rendus très agréables a l'œil, c'est un outil qui remplit parfaitement un rôle pour lequel nous n'avons pas forcément de besoin. Dommage tout de même qu'elle ait été abandonnée, car personne ne semble avoir repris le flambeau.

 

Isomer