SVG 엘리먼트 - ChoDragon9/posts GitHub Wiki

• <circle>: 원 그리기
• <image>: 이미지 파일을 가져옴
• <line>: 라인 그리기
• <marker>: 시작/종료/꺽어지는 부분에 도형을 넣음
• <path>: 도형을 만들 수 있음
• <polygon>: 닫힌 도형
• <polyline>: 열린 도형
• <rect>: 사각형
• <text>: 텍스트
• <tspan>: <text>의 서브 텍스트 정의

• <defs>: 스토어를 만듬. 나중에 사용할 엘리먼트 저장. <use>로 사용.
• <symbol>: 엘리먼트를 선언해서 재사용. <use>로 사용.
• <use>: SVG 문서 내에 있는 엘리먼트를 복제한다. x, y, width, height, href만 오버라이드한다.

• <a>: 링크. CSS 사용시 @namespace 사용해야함.
• <script>: script를 작성할 수 있음. ESM 미지원.
• <style>: stylesheet를 넣을 수 있음.

• <desc>: 설명 작성. 렌더링 안됨.
• <title>: 짧은 텍스트 작성. 렌더링 안됨.

• <g>: SVG 엘리먼트를 그룹화. 속성을 상속 시킬 수 있음.
• <metadata>: 구조 정보에 대한 페이지
• <set>: attribute의 값을 세팅
• <svg>: SVG Container를 만듬. 내부 SVG에는 xmlns을 미사용해도됨.
• <foreignObject>: 외부 XML 네임스페이스에 있는 엘리먼트를 포함

• <animate>: 해당 속성을 애니메이션 처리하는 기능
• <feBlend>: blending mode를 저장
• <filter>: 필터 효과 적용
• <linearGradient>: Linear Gradient를 만듬
• <mask>: 현재 객체 배경에 투명 마스크를 조합함
• <animateMotion>: 경로를 따라 어떻게 움직일지 정의
• <mpath>: <animateMotion>내에서 <path>를 참조하도록함
• <pattern>: 반복되는 도형을 그림
• <radialGradient>: Radial Gradient를 그림
• <stop>: Gradient의 색상 범위 지정
• <switch>: systemLanguage 속성으로 일치하는 language가 있을 때 해당 부분을 렌더링함.
• <textpath>: <path>와 연결해서 텍스트를 라인에 맞게 그림