HTML5 SVG Elemanı ile Daire (Circle) Çizimi
<circle> elemanı, svg ile bir daire çizmek için kullanılır. Aşağıda bir daire ve bu dairenin kodları verilmiştir:
Bu dairenin kodları şöyledir:
<svg height="100" width="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>
Bu kodlarda:
cx="50" cy="50" özellikleri, dairenin merkez noktasının, svg elemanına göre koordinatlarıdır. Eğer svg elemanına göre dairemizin merkezi (0,0) noktası olacaksa, bu iki özellik belirtilmeyebilir.
r="40" özelliği, dairenin yarıçapının kaç pixel olacağını ilan eder.
stroke="black" özelliği, dairenin dış çizgisinin rengidir.
stroke-width="3" özelliği, dış çizginin kalınlığıdır. (pixel olarak)
fill="red" özelliği ise dairenin iç dolgusunun rengini belirler.
Bu dairenin kodları şöyledir:
<svg height="100" width="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>
Bu kodlarda:
cx="50" cy="50" özellikleri, dairenin merkez noktasının, svg elemanına göre koordinatlarıdır. Eğer svg elemanına göre dairemizin merkezi (0,0) noktası olacaksa, bu iki özellik belirtilmeyebilir.
r="40" özelliği, dairenin yarıçapının kaç pixel olacağını ilan eder.
stroke="black" özelliği, dairenin dış çizgisinin rengidir.
stroke-width="3" özelliği, dış çizginin kalınlığıdır. (pixel olarak)
fill="red" özelliği ise dairenin iç dolgusunun rengini belirler.
Hiç yorum yok:
Yorum Gönder