Tutorial HTML5 Canvas (Fill dan Gradient)

Sebagai lanjutan dari tulisan sebelumnya masih mengenai Canvas dalam HTML5, berikut kita membahas mengenai Fill dan Gradasi (Gradient). Tentu kita hanya menggunakan fungsi2 bawaan HTML5 untuk mengelola canvas. Hasil akhir dari pelajaran kita hari ini kira2 seperti gambar berikut :

HTML5 Canvas Fill and Gradient

Langkah2nya pembuatannya masih sama mulai dari mempersiapkan halaman HTML yang berisi tag canvas dalam <body></body> seperti tag berikut :

Selanjutnya rujuk ke file JS atau tambahkan tag <script></script> yang berisi code berikut

Maka hasilnya akan menjadi seperti gambar di atas, atau hasil berikut :

Maaf saya masih males ngasi panduan bertele2 dalam kata2, karna dalam soure code sudah disertai ketarangan tidap bagiannya. Kalo ada yang belum jelas, atau salah, atau usul atau protes, silahkan tulis komen.
Moga pikiran yang baik senantiasa menyertai kita.
Makasih

0 komentar:

Posting Komentar

More

Label

3D (1) blogger (1) Canvas (2) cerita pribadi (4) cms (1) coreldraw (1) delphi (6) freeware (1) GLScene (1) gps (1) HTML5 (2) humor (1) library (1) mysql (4) OLE/DDE (1) online tools (2) oop (2) OpenGL (1) photoshop (2) php (1) PJU (2) project (4) referensi (1) software (9) tamzbackup (1) tutorial dasar (8) zeos (3)