Trabajar con dibujos en HTML5 puede llegar a ser algo tedioso y complicado si utilizamos las funciones nativas de JavaScript para su creación y posterior gestión, pero como todo en programación existen unas librerías estupendas que nos ayudan con esta tarea. En concreto yo he utilizado 2 de ellas, una para jQuery llamada jCanvas, autodefinida como un plugin que hace el trabajo con canvas HTML5 fácil; y FabricJS una librería independiente para el manejo de lienzos (canvas) en HTML5.
Ambas, como su documentación indica, nos ayudan a que el trabajo con dibujos sea mucho más simple, ambas están orientadas a objetos y están disponibles desde CDN o para descargas locales, además de mantener el soporte activo.
Estas librerías coinciden en lo siguiente:
-
buena documentación
-
acceso desde CDN o local, con archivos minimizados o brutos
-
programación orientada a objetos
-
un solo archivo es necesario para trabajar con ellas (sin contar jQuery que sería necesario en jCanvas)
-
disponible la documentación en inglés
Pero tienen algunas diferencias fundamentales que nos hacen decantarnos por una u otra.
FabricJS al ser una librería que no depende de ningún framework, como jQuery, puede llegar a ser más rápida y nos hace ser más independientes. Tiene muchísimas más funciones con lo cuál la documentación es mucho más amplia aunque la presencia de un tutorial nos puede hacer más llevadero el contacto inicial.
Ventajas de FabricJS sobre jCanvas
-
es una librería mucho más potente, versátil y configurable
-
el manejo de objetos es mucho más amplio; modificar el tamaño, rotar, mover (incluso bloquear los movimientos en un eje) es muy sencillo y se hace desde la configuración de cada objeto
-
centrar el texto en un rectángulo es una opción más al configurar un grupo
-
puedes crear tus propios objetos heredando de los que ya trae la librería por defecto
-
trabajo con opacidades y colores mucho más intuitivo
-
el trabajo con grupos de objetos es trabajar con un objeto más, no es necesario definir capas adicionales
-
puedes serializar y des serializar un canvas, crear una URL o un SVN, todo de manera nativa en el propio objeto
-
más rápida
Ventajas de jCanvas sobre FabricJS
-
al ser un plugin es más pequeño y para implementaciones simples puede venir muy bien
-
la captura de eventos sobre cada objeto es mucho más intuitiva, puedes definir funciones para cada evento en cada figura cosa que en FabricJS no, en FabricJS la gestión de eventos es global y debes tratar en cada uno de ellos con que objeto estas trabajando
Yo actualmente en mis proyectos utilizo FabricJS ¿alguna aportación más?
Comentarios