HTML5/SVG23 SVG Polygon * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Polygon - 태그는 최소 3개의 면을 가진 그래픽요소를 만들때 사용한다.Polygon들은 곧은 선들로 이루어져있다. 그리고 모양은 "닫혀있다"Polygon 은 그리스어로부터 왔다. "Poly" 의 의미는 "많은" 그리고 "gon" 은 "각". 예제 1아래 예제는 3개의 면을 가진 polygon 이다. Sorry, your browser does not support inline SVG. SVG 코드 코드 설명points 속성은 polygon 각 코너의 x,y 좌표를 나타낸다. (200,10) ==> 첫번째 x,y (250,190) ==> 두번째 x,y (160,210) =.. 2015. 6. 8. SVG Line * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Line - 태그는 선을 만들때 사용한다. Sorry, your browser does not support inline SVG. SVG 코드 코드 설명x1, y1 요소는 각각 선의 x축 , y축의 시작을 정의x2, y2 요소는 각각 선의 x축 , y축의 끝을 정의 출처 W3SCHHOL.COM - SVG - Linehttp://www.w3schools.com/svg/svg_line.asp 2015. 6. 8. SVG Ellipse * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Ellipse - 태그는 타원을 만들때 사용. 타원은 엄밀히 말하면 원에 가깝다. 둘의 다른점은 타원은 x, y 반지름이 다르다. 원은 x,y 반지름이 같다. 예제 1 Sorry, your browser does not support inline SVG. SVG 코드 코드 설명cx 요소와 cy 요소는 각각 타원의 x,y 좌표를 정의한다.rx 요소는 가로 반지름을 정의하고 ry 요소는 세로 반지름의 요소를 정의한다. 예제 2 Sorry, your browser does not support inline SVG. SVG 코드 예제 3 Sorry, your browser does n.. 2015. 6. 8. SVG Circle * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Circle - 태그는 원을 만들때 사용한다 Sorry, your browser does not support inline SVG. SVG 코드 코드 설명cy , cy 요소는 원의 중심의 x , y 좌표를 정의한다. 만약 cx , cy 가 생략되었다면 원의 중심은 0,0으로 설정된다.r 요소는 원의 반지름을 정의한다. 출처 : W3SCHOOL.COM - SVG - Circlehttp://www.w3schools.com/svg/svg_circle.asp 2015. 6. 8. 이전 1 2 3 4 5 6 다음
