Skip to content

Parsing

thingsub edited this page Dec 19, 2025 · 3 revisions

SVG Parsing 구조 및 처리

// (형식만 참고해요 내용은 편하게)

1. 개요

본 문서는 로봇팔 시뮬레이터 프로젝트 plotto에서
SVG 파일을 입력으로 받아 로봇 동작 생성에 필요한
경로 데이터로 변환하는 SVG 파싱 과정을 설명합니다.

SVG 파싱은 시스템 전체 동작 파이프라인의 첫 단계로,
이 단계에서 추출된 경로 정보는 이후 좌표 변환,
기구학 계산 및 plotto Path 생성의 입력 데이터로 사용됩니다.


2. SVG 파싱의 역할

SVG는 XML 기반의 벡터 이미지 포맷으로,
다양한 요소와 속성을 포함하고 있으나
plotto 시스템에서는 경로(Path) 정보만을 선택적으로 활용합니다.

SVG 파싱 단계의 주요 목적은 다음과 같습니다.

  1. SVG 파일 구조 해석
  2. 경로(Path) 요소 추출
  3. 경로 명령어를 좌표 기반 데이터로 변환
  4. 펜 업/다운 상태를 명확히 구분

3. 입력 데이터 구조

3.1. SVG 파일

  • 입력 형식: .svg
  • 파싱 방식: XML 기반 구조 분석
  • 주요 대상 요소: <path> 태그

3.2. 경로(Path) 데이터

SVG의 경로는 d 속성에 문자열 형태로 저장되며,
복수의 명령어와 좌표 정보가 순차적으로 포함됩니다.

M 10 10 L 50 50 Z
// 이거 도입부에 언어 (```) javscript로 명시하는 게 제일 깔끔합니더

6. 내부 경로 데이터 구조

파싱된 경로 정보는 문자열이 아닌, 시스템 내부에서 처리 가능한 구조화된 데이터로 변환됩니다.

[
  { type: "move", x: 10, y: 10 },
  { type: "line", x: 50, y: 50 },
];

각 명령은 이후 단계에서 펜 상태 및 관절 동작 데이터로 변환됩니다.

7. 펜 상태 처리 기준

준서야 그 path 내 처리 vs path 간 처리 같이

파싱할 때 고민했던 시행착오들 떠올려서 적으면 될 것 같아

뭐 각 path는 M으로 시작한다... 뭐 언제 펜을 뗄지 할당해준다..라던지

8. 다음 처리 단계와의 연결

9. 확장 및 제한 사항

복잡한 곡선 경로(Curve) 처리 미지원

다중 path 병합 규칙은 단순 순차 처리

SVG 좌표계와 로봇 좌표계 간 스케일 문제는 별도 처리

Clone this wiki locally