Editor has no 'show node coordinates' overlay — user wanting to see all node positions at once has to click each one, no at-a-glance coordinate display #305

New issue

Closed

opened 2026-10-04 03:49:06 +00:00 by Mark · 1 comment

Mark commented

2026-10-04 03:49:06 +00:00

Owner

Finding

grep -rn 'showCoordinates\|node.*coord' src/components/editor/ returns 0. The editor doesn't have a "show all node coordinates" toggle.

A user with 50 nodes across 5 paths:

Wants to see the (x, y) of each node at a glance
Has to click each one
Time-consuming

The fix is a debug-style toggle: show a small "(x, y)" label next to each node.

Where

canvasRenderer: src/components/editor/canvasRenderer.ts (where the nodes are drawn)
No show-coords: grep -rn 'showCoordinates' src/components/editor/ returns 0

Suggested fix shape

Toggle: in the editor's snap settings or toolbar, a "Show coordinates" toggle:

<button
  onClick={() => setShowCoords((v) => !v)}
  data-testid="show-coords"
  title="Show node coordinates"
>
  <Hash size={12} />
</button>

Render: when showCoords is true, draw a small text label next to each node:

nodes.forEach((n, i) => {
  ctx.fillText(`(${n.x.toFixed(1)}, ${n.y.toFixed(1)})`, n.x + 8, n.y - 8);
});

State: the toggle is local (not persisted) — it's a debug aid.
Use cases: precise positioning, debugging path issues, exporting coordinates for documentation.

Severity

Low. The user can click each node. Power users debugging notice.

Discovered by

Gap analysis (2026-10-02) of editor debug affordances.

The right panel's Path Properties shows the selected node's coordinates. The toggle is the bulk version.
Figma/Illustrator have similar debug overlays.
The "ruler/grid" (per #288) is the same family of in-canvas overlays.

## Finding `grep -rn 'showCoordinates\|node.*coord' src/components/editor/` returns 0. The editor doesn't have a "show all node coordinates" toggle. A user with 50 nodes across 5 paths: - Wants to see the (x, y) of each node at a glance - Has to click each one - Time-consuming The fix is a debug-style toggle: show a small "(x, y)" label next to each node. ## Where - canvasRenderer: `src/components/editor/canvasRenderer.ts` (where the nodes are drawn) - No show-coords: `grep -rn 'showCoordinates' src/components/editor/` returns 0 ## Suggested fix shape 1. **Toggle**: in the editor's snap settings or toolbar, a "Show coordinates" toggle: ```tsx <button onClick={() => setShowCoords((v) => !v)} data-testid="show-coords" title="Show node coordinates" > <Hash size={12} /> </button> ``` 2. **Render**: when `showCoords` is true, draw a small text label next to each node: ```ts nodes.forEach((n, i) => { ctx.fillText(`(${n.x.toFixed(1)}, ${n.y.toFixed(1)})`, n.x + 8, n.y - 8); }); ``` 3. **State**: the toggle is local (not persisted) — it's a debug aid. 4. **Use cases**: precise positioning, debugging path issues, exporting coordinates for documentation. ## Severity Low. The user can click each node. Power users debugging notice. ## Discovered by Gap analysis (2026-10-02) of editor debug affordances. ## Related - The right panel's Path Properties shows the selected node's coordinates. The toggle is the bulk version. - Figma/Illustrator have similar debug overlays. - The "ruler/grid" (per #288) is the same family of in-canvas overlays.

Mark added the

feature-request

triage-approved

labels

2026-10-04 03:49:07 +00:00

Mark referenced this issue

2026-10-04 03:53:41 +00:00

Editor's Path Properties section has no 'selected node' indicator when a single node is selected — user can't tell which node in the path is currently active (vs the others), no visual highlight #333

Mark referenced this issue

2026-10-04 03:57:02 +00:00

Editor's Path Properties has a 'Total nodes' display but no 'selected node index' / 'node N of M' — user cycling through nodes (Tab) with a 20-node path doesn't know 'I'm at node 5 of 20' #358

Mark referenced this issue

2026-10-04 03:58:37 +00:00

Editor's Path Properties section has 'Path length' but the 'per-node distance' is not visible — user wanting to know the length of each segment (e.g., 'node 4 to 5 is 12mm') has to compute from the (x, y) values #370

Mark referenced this issue from a commit

2026-10-04 21:42:50 +00:00

fix(#305): right-panel 'Show Coordinates' toggle draws (x, y) next to each node

Mark commented

2026-10-04 21:43:01 +00:00

Author

Owner

Shipped at f846738. Right-panel Snap Settings now has a "Show Coordinates" toggle (default off). When enabled, the canvas draws a small (x, y) label next to every visible node in path-units (mm) — same family of debug overlays as Show Grid (#288). Hidden paths are skipped. Coordinates reported in mm regardless of zoom so users can copy/paste them directly into documentation or scripts.

Shipped at f846738. Right-panel Snap Settings now has a "Show Coordinates" toggle (default off). When enabled, the canvas draws a small `(x, y)` label next to every visible node in path-units (mm) — same family of debug overlays as Show Grid (#288). Hidden paths are skipped. Coordinates reported in mm regardless of zoom so users can copy/paste them directly into documentation or scripts.

Mark closed this issue

2026-10-04 21:43:04 +00:00

Mark referenced this issue from a commit

2026-10-05 03:10:18 +00:00

feat(#333): editor Highlight Selected Node toggle + 'Node X of Y' label