Dasar Canvas HTML5
HTML 5
memperkenalkan <canvas> sebagai elemen baru, terutama untuk menggambar
grafik menggunakan JavaScript. Fasilitas ini bisa menangani banyak tugas seperti alat bantu
grafis sederhana (menggambar grafik), membuat komposisi foto dan membuat
animasi dasar.
Tutorial langkah demi langkah menjelaskan cara mengimplementasikan elemen kanvas dalam aplikasi web WhatWG atau HTML5 <canvas> elemen tidak terlalu sulit untuk digunakan, namun Anda perlu mengetahui dasar-dasar HTML dan Javascript.
Untuk Apa elemen <canvas> ?
Adapun beberapa hal dasar yang dilakukan dalam canvas sebagai berikut :
A. Menampilkan Canpas
Proses penampilannya, seperti biasa kita perlu mengetikan beberapa kode yang di awali kode inti <html> dan di akhiri </html>. Koding nya berikut saya lampirkan dan bisa langsung di copy. ☺
<!DOCTYPE html>
<html>
<body>
<center><canvas id="myCanvas" width="600" height="500" style="border:2px
solid blue;">
Your browser does not support the HTML5 canvas tag.
</canvas>
</center>
</body>
</html>
Hasilnya maka akan tampil sebagai berikut:
 |
| 1.1. Canvas Pertamaku |
untuk besar kecilnya canvas kita bisa rubah sesui keinginan kita dimana perhatikan ada width dan height yang bisa kita atur sesuka hati kita.
Dan untuk tulisan " Your browser does not support the HTML5 canvas tag" tidak akan tampil ketika browser yang kita miliki terupdate, apabila browser kita tidak di update dan not support maka akan muncul tulisan tersebut.
Tidak ada komentar:
Posting Komentar