안녕하세요 찐망고입니다.오늘은 SVG 애니메이션 관련 포스팅을 시작해 볼게요 SVG애니메이션의 핵심은 stroke-dashoffset인데요.stroke-dashoffset은 SVG에서 경로(패스)의 테두리에 적용할 수 있는 속성 중 하나로,stroke-dasharray와 함께 사용되며 경로를 따라 선을 그릴 때의 시작지점을 조정하는 역할을 합니다. stroke-dasharray는 선을 일정한 패턴의 대시와 공백으로 나누는 속성인데, 위와 같은 코드인 경우 설정된 선의 5px만큼 그 뒤로 10px만큼의 공백을 반복하는 형태를 뜻합니다. stroke-dashoffset은 기본적으로 0으로 설정되어 있으며, 을 증가시키면 대시패턴이 이동하여 경로를 따라 선이 그려지는 위치가 변경됩니다. JS를 이용하면..
