Manipular y animar archivos SVG

por .

SVG.js es una pequeña y potente biblioteca JavaScript para manipular y animar archivos en formato SVG.

La biblioteca completa tiene un peso excelente, apenas 5kb en su versión simplificada y comprimida mediante gzip. Un tamaño insignificante si lo comparamos con la cantidad de acciones fantásticas que podemos realizar utilizando JavaScript y la versatilidad que da un archivo en formato SVG.

manipular y animar SVG

A diferencia de otras bibliotecas similar, SVG.js cuenta con una extensa documentación, y si bien su utilización no es complicada, tener tanta información con ejemplos facilita considerablemente el proceso de aprendizaje.

Ejemplo de uso:

// create svg drawing paper
var draw = svg('paper');

// create image
var image = draw.image('images/shade.jpg');
image.size(600, 600).move(0, -150);

// create text
var text = draw.text('SVG.JS');
text.move(300, 40).fill('#fff');
text.font({
    family: 'Source Sans Pro',
    size: 180,
    anchor: 'middle',
    leading: 1
});

// mask image with text
image.maskWith(text);

No olviden visitar la sección de ejemplos para poder apreciar mejor de lo que es capaz este fantástico proyecto.

Web: SVG.js

Categorizado en: