HTML 그래픽 – 폴리라인

카테고리: 공부 » 풀스택 » 프론트엔드 »

2개월전 작성

폴리라인

SVG 폴리라인 – <polyline>

<polyline> 요소는 여러 점에서 연결된 직선만으로 구성된 어떤 모양을 만드는 데 사용된다.

<polyline> 요소에는 폴리라인의 점을 정의하는 하나의 기본 속성이 있다.

속성명	설명
points	필수. 폴리라인의 점 목록. 각 점은 x 좌표와 y 좌표를 포함해야 한다.

폴리라인

<svg height="210" width="500" xmlns="http://www.w3.org/2000/svg">
  <polyline points="0,0 50,150 100,75 150,50 200,140 250,140" style="fill:none;stroke:green;stroke-width:3" />
</svg>

<points> 속성은 폴리라인을 그리는 데 필요한 점 목록(각각의 x 및 y 좌표 쌍)을 정의한다.

또 다른 폴리라인

<svg height="180" width="500" xmlns="http://www.w3.org/2000/svg">
  <polyline points="0,40 40,40 40,80 80,80 80,120 120,120 120,160" style="fill:yellow;stroke:red;stroke-width:4" />
</svg>

참고

W3C School - SVG <polyline>

Mingg`s Diary

밍구

공부 목적 블로그

모든 포스트 보기

목록

댓글 답글 취소

이 사이트는 Akismet을 사용하여 스팸을 줄입니다. 댓글 데이터가 어떻게 처리되는지 알아보세요.

« Excel – 매크로 – 이메일 링크 생성

Excel – 작업 효율을 두 배로! 업무 시간을 절약하는 Excel 단축키 총정리 »