Vivus.js

Vivus.js

Vivus é uma classe JavaScript leve que permite animar SVGs, dando a eles a aparência de serem desenhados.
Vivus é uma classe JavaScript leve (sem dependências) que permite animar SVGs, dando a aparência de serem desenhados.Há uma variedade de animações diferentes disponíveis, bem como a opção de criar um script personalizado para desenhar seu SVG da maneira que você desejar.Tipos de animação • Atrasado: todos os elementos do caminho são desenhados ao mesmo tempo com um pequeno atraso no início.Esta é atualmente a animação padrão.• Sincronizar: cada linha é desenhada de forma síncrona.Todos eles começam e terminam ao mesmo tempo, daí o nome `sync`.• OneByOne: cada elemento do caminho é desenhado um após o outro.Essa animação dá a melhor impressão de desenho ao vivo.Função de tempo Para dar mais liberdade, é possível substituir a animação de cada caminho e / ou de todo o SVG.Funciona um pouco como a função de tempo de animação CSS.Mas, em vez de usar uma função cúbica-bezier, ela usa uma função JavaScript simples.Ele deve aceitar um número como parâmetro (entre 0 e 1) e retornar um número (também entre 0 e 1).É um gancho.Cenarizar Esse recurso permite que você crie scripts da animação do seu SVG.Para fazer isso, os valores personalizados serão definidos diretamente no DOM do SVG.Aqui está um exemplo usando a sincronização de cenário.Eu recomendo que você consulte o código-fonte e o arquivo leia-me para obter mais informações.
vivus-js

Local na rede Internet:

Recursos

Alternativas ao Vivus.js para JavaScript com licença de código aberto