Malisa Huzaifa - Web Multimedia HTML6 Canvas & SVG

91 Pada program ini hal pertama yang dilakukan adalah membuat sebuah canvas dengan emnggunakan <canvas id="canvas" width=512 height=400></canvas> yanga disini kita membuat sebuah canvas dengan ukuran 512, 400 dengan id canvas. Pada code ini kita menggunakan css yang digunakan untuk menentukan warna background dan line dari canvas dengan menggunakan code body{ background-color:white; } yang menampilkan warna background putih dan #canvas{border:1px solid red; } yang menampilkan garis dari canvas dengan warna merah dan memiliki ketebalan 1px. Selanjutnya kita masuk pada bagian javascrip dimana bagian awal kita gunakan window.onload=(function(){..} yang akan menjalan perintah didalam fungsi ketika program di run. Pada fungsi ini terdapat perintah var canvas=document.getElementById("canvas"); bertujuan untuk memilih elemen pada HTML dan var ctx = c.getContext("2d"); digunakan untuk membuat sebuah object dengan nama ctx yang nantinya akan kita gunakan untuk menggambar. Pada program ini setelah menyediakan var canvas=document.getElementById("canvas"); dan var ctx=canvas.getContext("2d"); langakah selanjutnya membaca ukuran dari canvas dengan menggunakan var cw=canvas.width; untuk menyimpan nilai lebar dan var ch=canvas.height; untuk menyimpan nilai tinggi.

RkJQdWJsaXNoZXIy MTM3NDc5MQ==