Membuat Animasi dengan Canvas HTML5

Hallo dumenity, sekarang kita akan belajar membuat animasi dengan canvas HTML5. Sebelumnya kita telah belajar membuat sebuah garis dan warna obyek . Pada tutorial ini animasi yang kita buat adalah sebuah kotak yang bergerak dari kiri ke kanan. Ini merupakan basic animasi canvas yang perlu kita pelajari. Untuk lebih memahami buatlah script berikut.

fillrect mendefinisikan pembuatan obyek rectangle dengan titik koordinat.

fillrect(x,y,width,height)

X+=2 merupakan proses penambahan titik koordinat  X pada obyek.

Hasilnya :

(Refresh browser jika ingin melihat hasilnya)

LATIHAN.

Buatlah animasi ini bergerak dari kanan ke kiri.

Selamat Mencoba.