@cardenelabs/cdl 0.121.0 → 0.123.0

package/src/layout/lanes.ts

@@ -1,4 +1,4 @@
-import type { CdlDiagram, CdlEdge, LaidLane, LaidNode } from "../types";
+import type { CdlDiagram, CdlEdge, CdlTextMetrics, LaidLane, LaidNode } from "../types";
 import { CLEARANCE_NODE_LABEL } from "./clearance-constants";
 import { computeLabelBoxW, EDGE_STUB_OUT, targetNodeNodeClearance } from "./spec";
 import { CONTAIN_PAD, DEFAULT_LANE_GAP, HEADER_RESERVE, LANE_LABEL_H, LANE_PAD_MIN } from "./tokens";
@@ -194,6 +194,7 @@ export function expandLaneGapsForEdgeLabels(
   lanes: LaidLane[],
   nodes: LaidNode[],
   edges: readonly CdlEdge[],
+  textMetrics: CdlTextMetrics = "proportional",
 ): LaidLane[] {
   if (lanes.length < 2) return lanes;
   // canvas pivot 新 spec (dragon canvas pivot spec §layout-role-conversion)。
@@ -240,7 +241,7 @@ export function expandLaneGapsForEdgeLabels(
     const fi = laneIndexById.get(fromLane);
     const ti = laneIndexById.get(toLane);
     if (fi === undefined || ti === undefined || fi === ti) continue;
-    const labelBoxW = computeLabelBoxW(edge.label, edge.sub);
+    const labelBoxW = computeLabelBoxW(edge.label, edge.sub, textMetrics);
     if (labelBoxW === 0) continue;
     const lo = Math.min(fi, ti);
     const hi = Math.max(fi, ti);

package/src/layout/metro-path.ts

@@ -0,0 +1,185 @@
+import type { CdlEdge, CdlTextMetrics, LaidNode, Side } from "../types";
+import { SAME_HEIGHT_THRESHOLD } from "./curve-path";
+import { computeLabelBoxW, EDGE_STUB_OUT, labelPathClearanceHorizontal, labelPillH } from "./spec";
+
+type 箱 = Pick<LaidNode, "cx" | "cy" | "w" | "h">;
+type 点 = { x: number; y: number };
+
+type 路線図の線の結果 = {
+  d: string;
+  fromSide: Side;
+  toSide: Side;
+  labelX: number;
+  labelY: number;
+  labelAnchor: "middle";
+};
+
+export const METRO_CORNER_RADIUS = 24;
+
+const T = Math.SQRT2 - 1;
+
+function round2(v: number): number {
+  return Math.round(v * 100) / 100;
+}
+
+function point(p: 点): string {
+  return `${round2(p.x)} ${round2(p.y)}`;
+}
+
+function add(p: 点, v: 点, scale: number): 点 {
+  return { x: p.x + v.x * scale, y: p.y + v.y * scale };
+}
+
+function polyline(points: readonly 点[]): string {
+  const distinct = points.filter((p, i) => {
+    const previous = points[i - 1];
+    return previous === undefined || p.x !== previous.x || p.y !== previous.y;
+  });
+  return distinct.map((p, i) => `${i === 0 ? "M" : "L"} ${point(p)}`).join(" ");
+}
+
+/**
+ * 2 つの箱を、水平線と傾き ±1 の斜線だけで結ぶ。
+ *
+ * 向かい合う辺の間に高さの差以上の横幅があれば斜線を中央へ置く。幅が足りない時は、
+ * 斜線の傾きを崩さず両方の右辺を結ぶため、右へ張り出すくの字にする。途中の箱は避けない。
+ */
+export function metroPath(
+  from: 箱,
+  to: 箱,
+  edge?: Pick<CdlEdge, "label" | "sub" | "style" | "overlay">,
+  labelMarginExtra = 0,
+  textMetrics: CdlTextMetrics = "proportional",
+): 路線図の線の結果 {
+  const fromLeft = from.cx - from.w / 2;
+  const fromRight = from.cx + from.w / 2;
+  const toLeft = to.cx - to.w / 2;
+  const toRight = to.cx + to.w / 2;
+
+  let fromSide: Side;
+  let toSide: Side;
+  let x1: number;
+  let x2: number;
+  let dir: 1 | -1;
+
+  if (toLeft >= fromRight) {
+    fromSide = "right";
+    toSide = "left";
+    x1 = fromRight;
+    x2 = toLeft;
+    dir = 1;
+  } else if (toRight <= fromLeft) {
+    fromSide = "left";
+    toSide = "right";
+    x1 = fromLeft;
+    x2 = toRight;
+    dir = -1;
+  } else {
+    fromSide = "right";
+    toSide = "right";
+    x1 = fromRight;
+    x2 = toRight;
+    dir = 1;
+  }
+
+  const y1 = from.cy;
+  const y2 = to.cy;
+  const dy = y2 - y1;
+  const sgn = Math.sign(dy);
+  let d: string;
+  let mid: 点;
+  let tangent: 点;
+
+  if (Math.abs(dy) < SAME_HEIGHT_THRESHOLD) {
+    d = `M ${point({ x: x1, y: y1 })} L ${point({ x: x2, y: y2 })}`;
+    mid = { x: (x1 + x2) / 2, y: (y1 + y2) / 2 };
+    tangent = { x: x2 - x1, y: y2 - y1 };
+  } else if (fromSide !== toSide && Math.abs(x2 - x1) >= Math.abs(dy)) {
+    const horizontal = Math.abs(x2 - x1);
+    const s = (horizontal - Math.abs(dy)) / 2;
+    const p0 = { x: x1, y: y1 };
+    const p1 = { x: x1 + dir * s, y: y1 };
+    const p2 = { x: x2 - dir * s, y: y2 };
+    const p3 = { x: x2, y: y2 };
+    const u = { x: dir, y: 0 };
+    const w = { x: dir / Math.SQRT2, y: sgn / Math.SQRT2 };
+    const r = Math.min(
+      METRO_CORNER_RADIUS,
+      s / T,
+      (Math.SQRT2 * Math.abs(dy)) / (2 * T),
+    );
+    const t = r * T;
+    if (r >= 0.5) {
+      const f1 = dir * sgn > 0 ? 1 : 0;
+      d = [
+        `M ${point(p0)}`,
+        `L ${point(add(p1, u, -t))}`,
+        `A ${round2(r)} ${round2(r)} 0 0 ${f1} ${point(add(p1, w, t))}`,
+        `L ${point(add(p2, w, -t))}`,
+        `A ${round2(r)} ${round2(r)} 0 0 ${1 - f1} ${point(add(p2, u, t))}`,
+        `L ${point(p3)}`,
+      ].join(" ");
+    } else {
+      d = polyline([p0, p1, p2, p3]);
+    }
+    mid = { x: (x1 + x2) / 2, y: (y1 + y2) / 2 };
+    tangent = w;
+  } else {
+    fromSide = "right";
+    toSide = "right";
+    x1 = fromRight;
+    x2 = toRight;
+    const xa = Math.max(x1, x2) + EDGE_STUB_OUT;
+    const h = Math.abs(dy) / 2;
+    const p0 = { x: x1, y: y1 };
+    const p1 = { x: xa, y: y1 };
+    const p2 = { x: xa + h, y: y1 + sgn * h };
+    const p3 = { x: xa, y: y2 };
+    const p4 = { x: x2, y: y2 };
+    const u = { x: 1, y: 0 };
+    const w1 = { x: 1 / Math.SQRT2, y: sgn / Math.SQRT2 };
+    const w2 = { x: -1 / Math.SQRT2, y: sgn / Math.SQRT2 };
+    const r = Math.min(METRO_CORNER_RADIUS, h);
+    const t = r * T;
+    const sweep = sgn > 0 ? 1 : 0;
+    d = [
+      `M ${point(p0)}`,
+      `L ${point(add(p1, u, -t))}`,
+      `A ${round2(r)} ${round2(r)} 0 0 ${sweep} ${point(add(p1, w1, t))}`,
+      `L ${point(add(p2, w1, -r))}`,
+      `A ${round2(r)} ${round2(r)} 0 0 ${sweep} ${point(add(p2, w2, r))}`,
+      `L ${point(add(p3, w2, -t))}`,
+      `A ${round2(r)} ${round2(r)} 0 0 ${sweep} ${point(add(p3, u, -t))}`,
+      `L ${point(p4)}`,
+    ].join(" ");
+    mid = { x: p2.x - T * r, y: p2.y };
+    tangent = { x: 0, y: sgn };
+  }
+
+  if (edge?.overlay) {
+    return { d, fromSide, toSide, labelX: mid.x, labelY: mid.y, labelAnchor: "middle" };
+  }
+
+  const tangentLength = Math.hypot(tangent.x, tangent.y);
+  let normalX = tangent.y / tangentLength;
+  let normalY = -tangent.x / tangentLength;
+  if (normalY > Number.EPSILON || (Math.abs(normalY) <= Number.EPSILON && normalX < 0)) {
+    normalX *= -1;
+    normalY *= -1;
+  }
+  const labelW = computeLabelBoxW(edge?.label, edge?.sub, textMetrics);
+  const labelH = labelPillH(edge?.sub);
+  const distance =
+    labelPathClearanceHorizontal(edge) +
+    (Math.abs(normalX) * labelW + Math.abs(normalY) * labelH) / 2 +
+    labelMarginExtra;
+
+  return {
+    d,
+    fromSide,
+    toSide,
+    labelX: mid.x + normalX * distance,
+    labelY: mid.y + normalY * distance,
+    labelAnchor: "middle",
+  };
+}

package/src/layout/nodes.ts

@@ -1,5 +1,5 @@
 import { requiredRowsWidth } from "../kinds/row-align";
-import type { CdlDiagram, LaidLane, LaidNode } from "../types";
+import type { CdlDiagram, CdlTextMetrics, LaidLane, LaidNode } from "../types";
 import { 端の字に要る線の長さ } from "./head-label";
 import {
   hasRenderedLabel,
@@ -77,10 +77,14 @@ function autoStorageHeight(
  *
  * 著者が n.w を明示している場合は尊重 (snapshot 互換 / catalog thumbnail 縮小指定を壊さない)。
  */
-function autoRowsWidth(n: { kind: string; rows?: string[]; w?: number }, defaultW: number): number {
+function autoRowsWidth(
+  n: { kind: string; rows?: string[]; w?: number },
+  defaultW: number,
+  textMetrics: CdlTextMetrics = "proportional",
+): number {
   if (n.w != null) return n.w;
   if (!n.rows || n.rows.length === 0) return defaultW;
-  const required = requiredRowsWidth(n.rows, n.kind);
+  const required = requiredRowsWidth(n.rows, n.kind, textMetrics);
   return Math.max(defaultW, required);
 }
 
@@ -171,7 +175,11 @@ function requiredStackGapForEdgeLabels(diag: CdlDiagram, allStacks: readonly num
   return required;
 }
 
-export function layoutNodes(diag: CdlDiagram, lanes: LaidLane[]): LaidNode[] {
+export function layoutNodes(
+  diag: CdlDiagram,
+  lanes: LaidLane[],
+  textMetrics: CdlTextMetrics,
+): LaidNode[] {
   const laneMap = new Map(lanes.map((l) => [l.id, l]));
 
   // 全 lane を跨いで stack 番号で row を共有する。
@@ -232,7 +240,7 @@ export function layoutNodes(diag: CdlDiagram, lanes: LaidLane[]): LaidNode[] {
     }
     const size = NODE_SIZE[n.kind];
     if (n.posX !== undefined && n.posY !== undefined) {
-      const w = n.posW ?? n.w ?? autoRowsWidth(n, size.w);
+      const w = n.posW ?? n.w ?? autoRowsWidth(n, size.w, textMetrics);
       const h = n.posH ?? n.h ?? rowH.get(n.stack) ?? size.h;
       out.push({
         ...n,
@@ -270,7 +278,7 @@ export function layoutNodes(diag: CdlDiagram, lanes: LaidLane[]): LaidNode[] {
     const h = n.h ?? (自前の高さ ? 箱の高さ(n, size.h) : 段の高さ);
     const cy = 段の芯;
     // n.w 明示時は尊重、 未指定で rows[] を持つ node は内容長に合わせて auto 拡張。
-    const w = autoRowsWidth(n, size.w);
+    const w = autoRowsWidth(n, size.w, textMetrics);
     out.push({
       ...n,
       cx,

package/src/layout/predict-bbox.ts

@@ -9,7 +9,7 @@
  */
 
 import { computeLabelBBoxWorld } from "./spec";
-import type { LaidEdge, LaidNode } from "../types";
+import type { CdlTextMetrics, LaidEdge, LaidNode } from "../types";
 
 /**
  * Edge label の world 単位 bbox 予測 (spec.ts SSOT の re-export)。
@@ -22,8 +22,11 @@ import type { LaidEdge, LaidNode } from "../types";
  * @param edge LaidEdge (labelX, labelY, labelAnchor, label, sub 既確定)
  * @returns { x, y, w, h } の world 座標 bbox (render 実 rect 位置と一致)
  */
-export function predictLabelBBoxWorld(edge: LaidEdge): { x: number; y: number; w: number; h: number } {
-  return computeLabelBBoxWorld(edge);
+export function predictLabelBBoxWorld(
+  edge: LaidEdge,
+  textMetrics: CdlTextMetrics = "proportional",
+): { x: number; y: number; w: number; h: number } {
+  return computeLabelBBoxWorld(edge, textMetrics);
 }
 
 /**

package/src/layout/self-loop.ts

@@ -1,4 +1,4 @@
-import type { CdlEdge, LaidEdge, LaidNode, Side } from "../types";
+import type { CdlEdge, CdlTextMetrics, LaidEdge, LaidNode, Side } from "../types";
 import { CLEARANCE_LABEL_LABEL } from "./clearance-constants";
 import { computeLabelBoxW, LABEL_TO_PATH_CLEARANCE, labelPillH } from "./spec";
 
@@ -120,7 +120,12 @@ export function pickFreeSides(occupied: ReadonlySet<Side> | undefined, count: nu
  *
  * 1 本だけの時は積む必要が無いので、辺の中央の真横に 1 つ置くだけになる。
  */
-export function routeSelfLoopGroup(edges: CdlEdge[], node: LaidNode, side: Side): LaidEdge[] {
+export function routeSelfLoopGroup(
+  edges: CdlEdge[],
+  node: LaidNode,
+  side: Side,
+  textMetrics: CdlTextMetrics = "proportional",
+): LaidEdge[] {
   const horizontal = side === "left" || side === "right";
   const g = sideGeometry(node, side);
   const span = fitSpan(horizontal ? node.h : node.w, SELF_LOOP_SPAN);
@@ -135,7 +140,7 @@ export function routeSelfLoopGroup(edges: CdlEdge[], node: LaidNode, side: Side)
 
   // 積む向きの語の大きさ。 横の辺なら縦に積むので高さ、縦の辺なら横に積むので幅
   const 語幅 = edges.map((e) =>
-    horizontal ? labelPillH(e.sub) : computeLabelBoxW(e.label, e.sub),
+    horizontal ? labelPillH(e.sub) : computeLabelBoxW(e.label, e.sub, textMetrics),
   );
   const 位置: number[] = [];
   let 積 = 0;
@@ -181,6 +186,7 @@ export function layoutSelfLoops(
   edges: CdlEdge[],
   nodes: Map<string, LaidNode>,
   occupiedBySide: ReadonlyMap<string, ReadonlySet<Side>>,
+  textMetrics: CdlTextMetrics = "proportional",
 ): LaidEdge[] {
   // 辺の割り当ては節ごとに 1 度で決める。 輪を 1 本ずつ処理して選び直すと、2 本目が
   // 1 本目の辺を「空いている」 と見て同じ場所に重なる
@@ -213,5 +219,5 @@ export function layoutSelfLoops(
   }
   // 語の置き場所は束の中の並びで決まるので、束ごとにまとめて経路にする。
   // 返す並びは呼出側が id で引き直すため、ここでは束の順で構わない
-  return [...束.values()].flatMap((b) => routeSelfLoopGroup(b.edges, b.node, b.side));
+  return [...束.values()].flatMap((b) => routeSelfLoopGroup(b.edges, b.node, b.side, textMetrics));
 }

package/src/layout/spec.ts

@@ -18,7 +18,7 @@
 import { CLEARANCE_LABEL_LABEL, CLEARANCE_NODE_LABEL } from "./clearance-constants";
 import { measureTextWidth } from "./text-width";
 import { EDGE_LABEL_TEXT } from "../label-text";
-import type { CdlEdge, LaidEdge, LaidLane, LaidNode } from "../types";
+import type { CdlEdge, CdlTextMetrics, LaidEdge, LaidLane, LaidNode } from "../types";
 
 // ─── edge label pill bbox SSOT (CAR-431 で 3 定義箇所を集約) ──
 
@@ -175,6 +175,7 @@ const KINDS_DRAWING_TITLE_OUTSIDE: ReadonlySet<string> = new Set([
   "dyn-arc",
   "dyn-wave",
   "dyn-polygon",
+  "station",
   ...KINDS_DRAWING_OWN_PAYLOAD,
 ]);
 
@@ -199,7 +200,7 @@ export function drawsTitleOutsideBox(kind: string | undefined): boolean {
  */
 const TITLE_FONT_SIZE_DEFAULT = 18;
 const TITLE_FONT_SIZE: ReadonlyMap<string, number> = new Map<string, number>([
-  ...(["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon"] as const).map(
+  ...(["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon", "station"] as const).map(
     (k) => [k, 13] as const,
   ),
   ...(
@@ -264,6 +265,19 @@ export function titleFontSize(kind: string | undefined): number {
   return TITLE_FONT_SIZE.get(kind ?? "") ?? TITLE_FONT_SIZE_DEFAULT;
 }
 
+/**
+ * 題の幅を node の箱幅で測らない種別。
+ *
+ * 駅の名前は小さな丸の外に置き、丸の幅で切らない。箱幅 24 を上限にすると、通常の駅名まで
+ * `text-readability` が読めない語として挙げるため、幅を箱の中で測る軸からだけ外す。
+ */
+const KINDS_WITH_TITLE_WIDTH_OUTSIDE_NODE: ReadonlySet<string> = new Set(["station"]);
+
+/** その node の題を箱幅に収める前提が成り立たないか */
+export function skipsNodeTitleWidthCheck(kind: string | undefined): boolean {
+  return KINDS_WITH_TITLE_WIDTH_OUTSIDE_NODE.has(kind ?? "");
+}
+
 /**
  * 題を箱の中に描く種別で、題が使えない左右の余白 (world)。
  *
@@ -428,6 +442,7 @@ const KINDS_DRAWING_ONLY_SHAPE: readonly string[] = [
   "dyn-arc",
   "dyn-wave",
   "dyn-polygon",
+  "station",
 ];
 
 /**
@@ -950,10 +965,21 @@ export function requiredVerticalLabelGap(pillHs: readonly number[]): number {
  * @param sub sub text (undefined なら 0)
  * @returns pill 全体の world 幅 (偶数)
  */
-export function computeLabelBoxW(label: string | undefined, sub: string | undefined): number {
-  const mainW = measureTextWidth(label ?? "", { fontSize: EDGE_LABEL_TEXT.main.fontSize });
+export function computeLabelBoxW(
+  label: string | undefined,
+  sub: string | undefined,
+  textMetrics: CdlTextMetrics = "proportional",
+): number {
+  const mainW = measureTextWidth(label ?? "", {
+    fontSize: EDGE_LABEL_TEXT.main.fontSize,
+    textMetrics,
+  });
   const subW = sub
-    ? measureTextWidth(sub, { fontSize: EDGE_LABEL_TEXT.sub.fontSize, fontFamily: "mono" })
+    ? measureTextWidth(sub, {
+        fontSize: EDGE_LABEL_TEXT.sub.fontSize,
+        fontFamily: "mono",
+        textMetrics,
+      })
     : 0;
   const raw = Math.max(mainW, subW) + LABEL_PILL_PAD_X * 2;
   // 切り上げる前に浮動小数の誤差を落とす。 文字幅は係数の掛け算と足し算を重ねるので、
@@ -984,8 +1010,11 @@ export function computeLabelBoxW(label: string | undefined, sub: string | undefi
  * @param edge LaidEdge (labelX / labelY / labelAnchor / label / sub 既確定)
  * @returns { x, y, w, h } の world 座標 bbox (render 実 rect 位置と一致)
  */
-export function computeLabelBBoxWorld(edge: LaidEdge): { x: number; y: number; w: number; h: number } {
-  const boxW = computeLabelBoxW(edge.label, edge.sub);
+export function computeLabelBBoxWorld(
+  edge: LaidEdge,
+  textMetrics: CdlTextMetrics = "proportional",
+): { x: number; y: number; w: number; h: number } {
+  const boxW = computeLabelBoxW(edge.label, edge.sub, textMetrics);
   const boxH = edge.sub ? LABEL_PILL_H_WITH_SUB : LABEL_PILL_H_MAIN_ONLY;
   const anchor = edge.labelAnchor;
   const boxLeftX = anchor === "start" ? 0 : anchor === "end" ? -boxW : -boxW / 2;

package/src/layout/text-width.ts

@@ -19,6 +19,8 @@
  * Bold は Regular に対し英字で +8-15%、 CJK は同じ、 記号は char により大差 (bold ならではの pen 太り)。
  */
 
+import type { CdlTextMetrics } from "../types";
+
 type FontFamily = "sans" | "mono";
 
 /**
@@ -39,6 +41,8 @@ interface MeasureOptions {
   letterSpacing?: number;
   fontFamily?: FontFamily;
   bound?: WidthBound;
+  /** 図全体の字幅規則。`monospace` は `fontFamily: "mono"` と同じ経路で測る */
+  textMetrics?: CdlTextMetrics;
 }
 
 /**
@@ -208,22 +212,20 @@ function defaultAdvanceEm(ch: string, code: number): number {
 }
 
 /**
- * 文字列の SVG render pixel 幅を実測係数で算出する。
+ * 最低幅を当てる前の SVG render pixel 幅を実測係数で算出する。
  *
- * @param text 対象文字列 (空文字は最低幅にクランプされる)
+ * @param text 対象文字列 (空文字は 0)
  * @param opts fontSize / fontWeight / letterSpacing / fontFamily の描画 context
  *
  * default = fontSize 22, fontWeight 700, letterSpacing 0, fontFamily "sans" (Inter Bold)。
  * edge label main text の caller (collisions / predict-bbox / edges) と一致する。
  * sub text (fontSize 19, fontFamily "mono") / lane label (fontSize 20, letterSpacing 2) は
  * opts で明示的に渡す。
- *
- * 最低幅 = fontSize × 1.2 (超短 label で bbox が細くなり shift 判定不安定になる問題を防ぐ)。
  */
-export function measureTextWidth(text: string, opts: MeasureOptions = {}): number {
+export function measureAdvanceWidth(text: string, opts: MeasureOptions = {}): number {
   const fontSize = opts.fontSize ?? 22;
   const letterSpacing = opts.letterSpacing ?? 0;
-  const fontFamily = opts.fontFamily ?? "sans";
+  const fontFamily = opts.textMetrics === "monospace" ? "mono" : (opts.fontFamily ?? "sans");
   const bound = opts.bound ?? "layout";
   let advanceEmSum = 0;
   let charCount = 0;
@@ -236,7 +238,7 @@ export function measureTextWidth(text: string, opts: MeasureOptions = {}): numbe
     // 割り戻さない = 測っていない字を狭く見積もると、はみ出す題を見落とす
     const 割り戻し =
       bound === "drawn" && !isEmojiGrapheme(ch, code)
-        ? isAscii(code)
+        ? isAscii(code) && fontFamily !== "mono"
           ? DRAWN_ASCII_RATIO
           : isCJK(code)
             ? DRAWN_CJK_RATIO
@@ -248,6 +250,10 @@ export function measureTextWidth(text: string, opts: MeasureOptions = {}): numbe
       continue;
     }
     if (fontFamily === "mono") {
+      // `DRAWN_ASCII_RATIO` (1.16) は Inter の比例幅表が実描画より広い分を見本帳の題で測った値。
+      // 0.63 は JetBrains Mono を実際に描いて測った値なので、割ると 0.543em になって等幅の
+      // 実描画 (0.6em 前後) より狭く見積もる。すると、はみ出す題を見落とし、木の箱の字を
+      // 収めたつもりで箱から出す。
       advanceEmSum += (isCJK(code) ? 1.08 : JETBRAINS_MONO_ADVANCE_EM) / 割り戻し;
       continue;
     }
@@ -262,7 +268,18 @@ export function measureTextWidth(text: string, opts: MeasureOptions = {}): numbe
     const table = ch.length === 1 ? INTER_BOLD_ADVANCE_EM[ch] : undefined;
     advanceEmSum += (table !== undefined ? table : defaultAdvanceEm(ch, code)) / 割り戻し;
   }
-  const w = advanceEmSum * fontSize + letterSpacing * charCount;
+  return advanceEmSum * fontSize + letterSpacing * charCount;
+}
+
+/**
+ * 文字列の SVG render pixel 幅を実測係数で算出する。
+ *
+ * 最低幅 = fontSize × 1.2 (超短 label で bbox が細くなり shift 判定不安定になる問題を防ぐ)。
+ */
+export function measureTextWidth(text: string, opts: MeasureOptions = {}): number {
+  const fontSize = opts.fontSize ?? 22;
+  const bound = opts.bound ?? "layout";
+  const w = measureAdvanceWidth(text, opts);
   // 最低幅は組み方のための下駄 (短い札で bbox が細くなり判定が揺れるのを防ぐ)。
   // 実描画に合わせる時は当てない = 1 字の題が 1.2 em で描かれることは無い
   return bound === "drawn" ? w : Math.max(w, fontSize * 1.2);

package/src/layout/tokens.ts

@@ -140,6 +140,8 @@ export const TOKENS = {
     // 箱としての最小 (80x40) より大きく、名前を持つ箱 (card 320x150) よりは明らかに小さい
     "mark-start": { w: 96, h: 96 },
     "mark-end": { w: 96, h: 96 },
+    // 路線図の駅 (#996) ... 正方形にして小さな丸が縦横どちらにも歪まないようにする。
+    station: { w: 24, h: 24 },
     // 時系列のやり取り (#578)。 実寸は中身から決まる (`sequenceBoardMetrics`) ので、
     // ここは書かなかった時の受け皿
     "sequence-board": { w: 960, h: 640 },

package/src/layout-with-validation.ts

@@ -14,7 +14,8 @@
  *      持つ edge の labelOffsetX/Y を 0 にリセット (作者の手動 offset で bbox 範囲外に押し出された
  *      label を default 位置に戻す)
  *  - h2 node-shift-down ... node-overlap error node pair の下 node の stack を +1
- *  - h3 edge-back-detour ... edge-node-cross error edge の routing を "back-detour" に切替
+ *  - h3 edge-back-detour ... edge-node-cross error のうち、自動経路の edge の routing を
+ *      "back-detour" に切替。 書き手が選んだ曲線と路線図の線は途中の箱を避けない約束なので変えない
  */
 import type { CdlDiagram, CdlEdge, LaidDiagram } from "./types";
 import { layout } from "./layout";
@@ -152,11 +153,15 @@ function applyHeuristics(
       .filter((id): id is string => id !== null),
   );
   if (h3Edges.size > 0) {
-    const originalEdges = edges;
-    edges = edges.map((e): CdlEdge =>
-      h3Edges.has(e.id) && e.routing !== "back-detour" ? { ...e, routing: "back-detour" } : e,
+    const eligibleEdges = new Set(
+      edges
+        .filter((e) => h3Edges.has(e.id) && (e.routing === undefined || e.routing === "default"))
+        .map((e) => e.id),
     );
-    if (edges !== originalEdges) {
+    if (eligibleEdges.size > 0) {
+      edges = edges.map((e): CdlEdge =>
+        eligibleEdges.has(e.id) ? { ...e, routing: "back-detour" } : e,
+      );
       applied.push("h3-edge-back-detour");
       mutated = true;
     }