Para todos aquellos que busquen una libreria de javascript que permita manejar vectores y generar graficas de manera sencilla RaphaelJS es probablemente la mejor opción. Entre este sus mejoras se encuentra la una manera mucho menos geométrica de trazar figuras geométricas y es compatible con todos los browsers, incluyendo IE6.
Un ejemplo de lo que podemos crear se encuentra en esta pequeña aplicación para visualizar información de SXSW jalando información de Twitter, Flickr y foursquare.
Tenemos un pequeño laberinto creado enteramente en JS, que es divertido hasta que nos damos cuenta que no tiene final.
Es posible pasar una imagen de vectores a muchos pequeños paths con lo cual podríamos eventualmente dejar de usar imágenes como suceden en este ejemplo donde dibujan un tigre. O si entran a sitio, el logo esta hecho de esta manera.
Cuenta con funciones como Rotate, Traslate y Scale para que podamos manipular la información que se encuentra dentro de nuestro canvas de manera muy sencilla, lo cual generalmente es un pain in the ass que implica pintar el canvas completo y mover el circulo cuando lo pintamos de nuevo, en este caso solo dice:
c.translate(10, 10);
y tienes un elemento 10 px a la derecha y hacia abajo. Recuerden que en los canvas el punto de referencia es la esquina superior derecha.
La manera que funciona para lograr que esto sea tan sencillo es que no usa canvas, usa SVG por lo cual cada elemento es creado como parte del DOM y esto puede hacer que le agreguemos eventos y manipularlo mucho más fácilmente.
Para todos los que estén buscando crear movimiento en la página y crear paginas dinámicas esto es una muy buena opción.
No related posts.