Teknik animasi SVG kecil yang popular adalah lukisan jalan. Sekiranya anda tidak dapat membayangkannya, berikut adalah koleksi zillion contoh yang saya buat. Pada asasnya pukulan di sekitar bentuk SVG menarik diri dari masa ke masa.
Saya mula-mula mendengarnya dari artikel Jake Archibald lukisan garis animasi di SVG, yang mengenai banyak penjelasan tentangnya. Tetapi tentu saja, saya juga mencuba penjelasan saya dan kita membincangkannya dalam video ini.
Saya rasa paling mudah untuk memikirkan memulakan dengan CSS, dan bagaimana sifat dash berfungsi seperti yang berlaku pada bentuk SVG. Bagaimana mereka boleh menjadi lebih lama, dan bahkan cukup lama sehingga menutupi (atau tidak menutupi) keseluruhan bentuk. Kemudian mengimbangi mereka ketika lama adalah bagaimana lukisan berfungsi.
Kemudian setelah anda memahaminya, fahami bahawa JavaScript dapat membantu mengira panjang tanda hubung dan ofset yang diperlukan dan melakukannya dengan betul.