Vivus to lekka klasa JavaScript (bez zależności), która pozwala animować pliki SVG, nadając im wygląd rysowania.Dostępnych jest wiele różnych animacji, a także możliwość utworzenia niestandardowego skryptu, aby narysować plik SVG w dowolny sposób.Typy animacji • Opóźnione: każdy element ścieżki jest rysowany w tym samym czasie z niewielkim opóźnieniem na początku.Jest to obecnie domyślna animacja.• Synchronizacja: każda linia jest rysowana synchronicznie.Wszystkie zaczynają się i kończą w tym samym czasie, stąd nazwa „synchronizacja”.• OneByOne: każdy element ścieżki jest rysowany jeden po drugim.Ta animacja daje najlepsze wrażenie rysowania na żywo.Funkcja pomiaru czasu Aby zapewnić większą swobodę, można zastąpić animację każdej ścieżki i / lub całego pliku SVG.Działa trochę podobnie do funkcji synchronizacji animacji CSS.Ale zamiast używać funkcji sześciennej beziera, używa prostej funkcji JavaScript.Musi zaakceptować liczbę jako parametr (od 0 do 1), a następnie zwrócić liczbę (również od 0 do 1).To jest haczyk.Scenariusz Ta funkcja umożliwia skryptowanie animacji pliku SVG.Aby to zrobić, wartości niestandardowe zostaną ustawione bezpośrednio w DOM pliku SVG.Oto przykład użycia synchronizacji scenariuszy.Polecam zajrzeć do kodu źródłowego i pliku readme, aby uzyskać więcej informacji.