Showing posts with label Canvas. Show all posts
Showing posts with label Canvas. Show all posts

Posisi Mouse dan HitTest

Hit-test adalah istilah yang sering digunakan untuk menyatakan pengecekkan posisi pointer mouse terhadap posisi suatu objek atau posisi su...

Melompat dan Jatuh

Untuk menampilkan gerakan jatuh, kita tidak bisa hanya menambah atau mengurangi posisi koordinat y dengan nilai yang sama. Kecepatan saat ...

Scrolling Background

Untuk membuat background, kita tidak perlu banyak gambar, kita bisa menggunakan background yang diulang-ulang atau bisa juga dengan mapping...

Animasi dengan Sprite Sheet

Untuk membuat animasi, kita bisa menggunakan setInterval. Kita bisa menggunakan sprite sheet yang berisi beberapa posisi dari karakter yang...

Mapping dengan Sprite Sheet

Sebelumnya, kita sudah mempelajari cara "memotong gambar" dan menempatkan potongan-potongan gambar tersebut di posisi tertentu. ...

Memotong Gambar dalam Canvas

Selain dengan menampilkan semua bagian foto, kita juga bisa menampilkan sebagian potongan dari satu foto yang utuh. Misalnya, kita punya g...

Foto dalam Canvas

Untuk menampilkan foto dalam kanvas, kita bisa menggunakan drawImage. Gambar yang berasal dari tag <img> atau bisa juga didapat denga...

Membuat Garis dan Polygon

Untuk membuat garis kita bisa menggunakan moveTo dan lineTo yang diapit dengan beginPath dan stroke. Misal : <HTML> <HEAD> ...