120 <line x1="20" y1="-40" x2="20" y2="-10" /> </svg> </body> </html> Referensi: Codepen.io. (modifikasi) Program diatas adalah program untuk merancang antarmuka rumah yang akan ditampilkan pada window browser. Pada bagian ini pertama-tama kita akan membuat bagian svg rumah dengan membuat sebuah code <svg class="rumah" width="220" height="220" viewBox="-95 -95 220 220">. Pada code ini kita beri nama svg dengan id="rumah" dengan ukuran lebar 220 dan tinggi 220. Kemudian kita gunakan yang namanya viewBox dengan titik (- 95 -95 220 220). Selanjutnya kita akan mulai membentuk gambar rumah dimana bagian awal kita mulai membuat dinding dari rumah terlebih dahulu dengan menggunakan <polygon class="dinding" points="-65,80 - 65,-10 20,-80 105,-10 105,80" fill="skyblue" />. Dinding rumah kita gambar menggunakn polylgon dengan menyisipkan sebuah class="dinding". Selanjutnya kita mulai tentukan titik dari polygon dimana titik ini membentuk gambaran kotak dengan bagian atas berbentuk persegi yang dihasilkan dari points="-65,80 -65,-10 20,- 80 105,-10 105,80". Terakhir dinding tersebut diberi warna biru langit.
RkJQdWJsaXNoZXIy MTM3NDc5MQ==