본문 바로가기
HTML5/SVG

SVG Circle

by Jundol 2015. 6. 8.

* 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.

* 필자의 기준이 절대적인 진리는 아닙니다.




SVG Circle - <circle>


<circle> 태그는 원을 만들때 사용한다


Sorry, your browser does not support inline SVG.

SVG 코드
<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>

코드 설명
  • cy , cy 요소는 원의 중심의 x , y 좌표를 정의한다. 만약 cx , cy 가 생략되었다면 원의 중심은 0,0으로 설정된다.
  • r 요소는 원의 반지름을 정의한다.

출처 : W3SCHOOL.COM - SVG - Circle


'HTML5 > SVG' 카테고리의 다른 글

SVG Line  (6) 2015.06.08
SVG Ellipse  (6) 2015.06.08
SVG rect  (66) 2015.06.08
SVG in HTML  (263) 2015.06.08
웹기반 편집기 개발을 위한 SVG 정리  (263) 2015.06.08

댓글