Malisa Huzaifa - Web Multimedia HTML6 Canvas & SVG

133 penunjuk jam dan penunjuk menit dengan menggunakan code <line id="hours" y2="-40" stroke-width="5"/> dimana code awal ini digunakan untuk menampilkan line untuk penunjuk jam dengan menggunakan id="hours" yang mana id ini sudah disetting sebelumnya pada bagian javascrip. Garis awal ini memiliki nilai y2="-40" dan ketebalan garis 5. Pada bagian line kedua code yang dituliskan adalah <line id="minutes" y2="-60" stroke-width="5" /> dimana code ini digunakan untuk menampilkan line untuk penunjuk menit dengan menggunakan id=" minutes" yang mana id ini sudah disetting sebelumnya pada bagian javascrip. Garis awal ini memiliki nilai y2="-60" dan ketebalan garis 5. Dengan begini berarti pembuatan jam sederhana pada svg sudah selesai. Berikut ini output dri program yang muncul pada window. Dari gambar terlihat bahwa garis jam yang pendek sejajar dengan kotak 11 sedangkan garis jam yang panjang terletak pada kotak 7. Selain itu sesuai dengan settinga program jam tersebut memiliki latar belakang sebuah kotak yang berwarna hijau. Jam yang ditampilkan memiliki warna latar putih dengan pinggiran berwarna kuning muda. Pengganti angka jam kita bisalah terdapa kotak-kotak yang didapat dari modifikasi pada garis lingkaran yang berjumlah 12. Silahkan nanti dicobakan pada komputer anda dan lakukanlah modifikasimodifikasi sehingga lebih paham lagi dalam belajar svg.

RkJQdWJsaXNoZXIy MTM3NDc5MQ==