coordinate stack

포인터를 viewport px → user space (viewBox) 로 옮기는 체인입니다.

데모에서 볼 것

• 640×420 SVG — mousemove 시 파란 원
• readout:
  • explainCoordinateStack의 note
  • pointer(px)=(…)
  • user=(…) — svgPoint와 동일 user space

API

import { explainCoordinateStack } from "svg-matrix-core";

explainCoordinateStack(
  { x: 320, y: 210 },              // pointer in viewport px
  { width: 640, height: 420 },
  { x: 0, y: 0, width: 640, height: 420 }
);
// { pointer, viewport, viewBox, userSpace, scale, note }

데모는 client 대신 SVG element 기준 px를 pointer로 넘깁니다. 실제 앱에서는 getBoundingClientRect() + createSVGPoint() + matrixTransform이 동일 역할입니다.

스택

pointer (viewport px)
  → userSpace (viewBox units)
  → (optional) local path transform

015 fill hit · 021 handle drag는 user space 좌표.

흔한 버그

Core API

관련

• 001 · 015 · 055

오늘의 핵심

hit test 전에 한 user-space로 통일 — client px를 그대로 쓰지 마세요.