Malisa Huzaifa - Web Multimedia HTML6 Canvas & SVG

130 </body> </html> Referensi: Codepen.io. (modifikasi) Dalam pembuatan jam sederhana ini kita akan menggunakan svg terlebih dahulu, dimana code yang digunakan adalah <svg width="200" height="200" viewBox="-100 -100 200 200">. Penggalan code ini menjelaskan bahwa kita akan menggunakan svg untuk membuat sebuah gambar dengan ukuran tinggi 200 dan lebar 200. Selain itu pada program ini juga menggunakan viewBox dimana ukuran yang dipakai adalah ="-100 -100 200 200". Berikutnya pada bagian code adalah mengatur settingan untuk waktu jam yang nanti akan ditampilkan. Code yang digunakan untuk settingan pengaturan jam adalah <script>..</script> yang merupakan tag javascrip. Pada bagian ini kita akan setting jam dimulai dari bagian window.addEventListener ("DOMContentLoaded", () => {..} dimana jika program dirun maka instruksi pada bagian window.addEventListener akan dieksekusi. Pada bagian awal DOMContentLoaded ini akan ada proses untuk mengambil elemen jam dari line svg dengan menggunakan code const hoursElement = document.getElementById("hours");. Kemudian pada program juga mengambil elemen menit dari line svg dengan menggunakan const minutesElement = document.getElementById ("minutes");. Selanjutnya kita akan

RkJQdWJsaXNoZXIy MTM3NDc5MQ==