76 posisi canvas dimana pada code menggunakan childNodes[0] sehingga canvas berada pada bagian awal dari window atau berada di atas button yang telah disediakan. Selanjutnya pada bagian start kita tambahkan interval dari gerakan animasi dengan menggunakan this.interval = setInterval(updateGameArea, 10);. Pada fungsi kedua adalah stop: function() {..} yang beriskan perintah untuk membersihkan pergerakan dari interval yang disediakan dengan code clearInterval(this.interval);. Fungsi ketiga clear : function() {..} berisikan code untuk menghapus gerakan animasi dari kotak dengan menggunakan this.context.clearRect(0,0,this.canvas.width,this.canvas.height);. Selanjutnya balik ke bagian kedua btnAnimasi.addEventListener ("click",function(){..} yang didalamnya terdapat myGamePiece = new component(40,40,"black",40,150); dimana pada code ini memanggil fungsi componen dengan menggambar sebuah kotak berwarna hitam dengan ukuran 40,40 dan titik mulai kotak muncul pada 40,150. Kita masuk pada bagian function component(width, height, color, x, y, type) {..} yang berisikan proses animasi gerakan kotak dan gambar lingkaran yang akan dikelilingi oleh kotak. Pada bagian awal adalah inisialisasi type, width, height, x, y, kemudian memberikan speed dengan nilai 1 dan angle bernilai 0 serta nilai 1 untuk moveAngel pada kotak seperti penggalan code utama berikut ini.
RkJQdWJsaXNoZXIy MTM3NDc5MQ==