@cardenelabs/cdl 0.112.0 → 0.114.0

package/CHANGELOG.md

@@ -5,6 +5,77 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.114.0] - 2026-09-30
+
+### Fixed
+
+- **左右で段数が違う放射の図が札の横を半分しか使わなかった** (#966)
+
+  枝を中心からどれだけ離すかが図で 1 つの値だった。
+  子を持つ枝は子の世代のぶんを内側に空ける必要があるので、その都合が子を持たない枝にも効く。
+  左が入れ子で右が葉 1 枚の図では右の枝も中心から 149 に留まり、
+  右には空ける相手が居ないのにその 171 を誰も使わない。
+
+  離す量を **枝ごとに** 出すようにした。
+  子を持つ枝は子を収める位置まで、末端の枝は名前が描画域の端に届く位置まで外へ出る。
+
+  | 枝 | 直す前 | 直した後 |
+  |---|---|---|
+  | 子を 1 段持つ枝 | 149 | 149 (変わらない) |
+  | 同じ側の末端の枝 | 149 | 296 |
+  | 反対側の末端の枝 | 149 | 338 |
+
+  あわせて末端の上限から「箱ごと描画域に収める」 という条件を外した。
+  末端は枠を持たない (#907) ので、収めるのは名前で箱ではない。
+  箱まで収めると、名前より 41 広い箱の都合で名前が描画域の内側で終わっていた。
+
+  名前を描く幅の見積りを、切る側 (`箱に積む` / `幅に収める`) と同じ `textWidth` に揃えた。
+  別の見積りで置き場所を決めていたため、ちょうど収まる位置に置いた名前が描く側で切られていた
+  (実測 = `Features` が `Featur…` になった)。
+
+  枝の離れは整数に落とす。
+  端数を持ったまま置くと枝の長さが座標の差から出るぶん丸め誤差が乗る
+  (実測 = 24 であるべき枝が 23.99999999999997 になった)。
+
+  中心の箱を横中央へ寄せる処理 (#913) は、両側が端まで届くようになったため
+  この形の図では働かなくなる。 片側にしか枝が無い図では引き続き働く。
+
+  見本帳 (`cardene777/dragon`) の 3 図を実際の画面で測ると、札の横を使う割合が
+  85% から 88%、52% から 88%、79% から 87% になった。
+
+## [0.113.0] - 2026-09-30
+
+### Fixed
+
+- **放射の枝が札の横を 3 分の 2 しか使わなかった** (#964)
+
+  枝を中心からどれだけ離すかが `canvasW * 0.32` という決め打ちの割合だった。
+  枝の名前は枠を持たず、枠があった位置の内側の端から外へ伸びる (#907) ので、
+  名前が短い図ではこの位置の外側に誰も使わない余白が残る。
+  見本帳で測ると、左の名前は 173.2 の余地に対して 90.6 しか使っていなかった。
+
+  離す量を **第 1 階層の葉の名前のうち一番広いもの** から出すようにした。
+  名前の右端が描画域の端に一致する位置 (`canvasW / 2 + branchW / 2 - 名前の幅`) を上限にする。
+  名前が短い図では枝が外へ出て、名前が長い図では逆に内側へ寄る。
+
+  | 図の形 | 直す前 | 直した後 |
+  |---|---|---|
+  | 左右 2 本ずつ | 237.4 | 305.0 |
+  | 名前が長い左右 2 本ずつ | 230.4 | 186.3 |
+  | 枝 14 本 | 235.4 | 309.9 |
+  | 第 1 階層が全て子を持つ | 175.0 | 175.0 (変わらない) |
+
+  第 1 階層に葉が 1 つも無い図では名前では決まらず、入れ子のぶんを空ける従来の上限がそのまま効く。
+
+  あわせて、札に収める最後の一様縮小が横を **描く端** で測るようにした。
+  末端は枠を持たないので、箱で測ると描いてもいない幅を占めていることになり、
+  何もはみ出していない図まで縮んでいた (枝 1 本の図が 0.83 倍になり、
+  箱の高さが 30.8 から 25.6 に縮んで補足の行が落ちていた)。
+
+  見本帳 (`cardene777/dragon`) の 3 図を実際の画面で測ると、札の横を使う割合が
+  66% から 85%、54% から 79% になった。 入れ子を持つ 1 図は 52% のまま変わらない
+  (中心の箱を描いた中身の真ん中に置く話で、別 Issue で扱う)。
+
 ## [0.112.0] - 2026-09-30
 
 ### Fixed
@@ -4479,7 +4550,9 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.112.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.114.0...HEAD
+[0.114.0]: https://github.com/cardene777/cdl/compare/v0.113.0...v0.114.0
+[0.113.0]: https://github.com/cardene777/cdl/compare/v0.112.0...v0.113.0
 [0.112.0]: https://github.com/cardene777/cdl/compare/v0.111.0...v0.112.0
 [0.111.0]: https://github.com/cardene777/cdl/compare/v0.110.0...v0.111.0
 [0.110.0]: https://github.com/cardene777/cdl/compare/v0.109.0...v0.110.0

package/dist/index.cjs

@@ -16141,7 +16141,7 @@ function \u63CF\u304F\u6A2A\u306E\u7AEF(n) {
   if (n.isRoot || !n.isLeaf) return [n.x - n.w / 2, n.x + n.w / 2];
   const \u8D77\u70B9 = n.x + (n.side === "right" ? -n.w / 2 : n.w / 2);
   const \u540D\u524D = \u653E\u5C04\u306E\u884C(n)[0];
-  const \u5E45 = measureTextWidth(\u540D\u524D.text, { fontSize: \u540D\u524D.fontSize});
+  const \u5E45 = textWidth(\u540D\u524D.text, \u540D\u524D.fontSize);
   return n.side === "right" ? [\u8D77\u70B9, \u8D77\u70B9 + \u5E45] : [\u8D77\u70B9 - \u5E45, \u8D77\u70B9];
 }
 function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
@@ -16214,30 +16214,52 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
     if (kids.length === 0) return 1;
     return kids.reduce((sum, k) => sum + leafCountOf(k.id, seen), 0);
   };
-  const maxSubDepth = firstLevel.length > 0 ? Math.max(0, ...firstLevel.map((br) => subDepthOf(br.id, /* @__PURE__ */ new Set()))) : 0;
+  const leftBranches = firstLevel.slice(0, leftCount);
+  const rightBranches = firstLevel.slice(leftCount);
   const minLayer1XOffset = rootW / 2 + branchW / 2 + MIND_BOX_GAP;
   const preferredSubDx = subBranchW + 20;
-  const reserve = maxSubDepth > 0 ? branchW / 2 + maxSubDepth * preferredSubDx : 0;
-  const maxLayer1XOffset = Math.max(minLayer1XOffset, canvasW / 2 - reserve);
-  const layer1XOffset = Math.max(minLayer1XOffset, Math.min(canvasW * 0.32, maxLayer1XOffset));
-  const room = canvasW / 2 - layer1XOffset;
   const MIN_SUB_W = 56;
   const PREFERRED_GAP = MIND_BOX_GAP;
-  const gapRoom = maxSubDepth > 0 ? (room - branchW / 2 - maxSubDepth * MIN_SUB_W) / maxSubDepth : 0;
-  const gap = Math.max(8, Math.min(PREFERRED_GAP, gapRoom));
-  const effSubW = maxSubDepth > 0 ? Math.max(1, Math.min(subBranchW, (room - branchW / 2 - maxSubDepth * gap) / maxSubDepth)) : subBranchW;
-  const step1 = (branchW + effSubW) / 2 + gap;
-  const stepN = effSubW + gap;
-  const subOffset = (subDepth) => subDepth <= 0 ? 0 : step1 + (subDepth - 1) * stepN;
-  const leftBranches = firstLevel.slice(0, leftCount);
-  const rightBranches = firstLevel.slice(leftCount);
+  const \u679D\u306E\u540D\u524D\u306E\u5E45 = (title) => {
+    const \u540D\u524D = \u653E\u5C04\u306E\u884C({ title, isRoot: false })[0];
+    return textWidth(\u540D\u524D.text, \u540D\u524D.fontSize);
+  };
+  const \u679D\u306E\u6A2A\u3092\u6C7A\u3081\u308B = (br) => {
+    const maxSubDepth = subDepthOf(br.id, /* @__PURE__ */ new Set());
+    const \u4E0A\u9650 = maxSubDepth > 0 ? canvasW / 2 - (branchW / 2 + maxSubDepth * preferredSubDx) : canvasW / 2 + branchW / 2 - \u679D\u306E\u540D\u524D\u306E\u5E45(br.title);
+    const layer1XOffset = Math.floor(Math.max(minLayer1XOffset, \u4E0A\u9650));
+    const room = canvasW / 2 - layer1XOffset;
+    const gapRoom = maxSubDepth > 0 ? (room - branchW / 2 - maxSubDepth * MIN_SUB_W) / maxSubDepth : 0;
+    const gap = Math.floor(Math.max(8, Math.min(PREFERRED_GAP, gapRoom)));
+    const effSubW = maxSubDepth > 0 ? Math.floor(
+      Math.max(1, Math.min(subBranchW, (room - branchW / 2 - maxSubDepth * gap) / maxSubDepth))
+    ) : subBranchW;
+    const step1 = (branchW + effSubW) / 2 + gap;
+    const stepN = effSubW + gap;
+    return {
+      layer1XOffset,
+      effSubW,
+      subOffset: (subDepth) => subDepth <= 0 ? 0 : step1 + (subDepth - 1) * stepN
+    };
+  };
+  const \u6A2A\u306E\u5272\u4ED8\u8868 = new Map(
+    firstLevel.map((br) => [br.id, \u679D\u306E\u6A2A\u3092\u6C7A\u3081\u308B(br)])
+  );
+  const \u4E00\u756A\u5185\u5074\u306E\u96E2\u308C = Math.min(
+    ...firstLevel.length > 0 ? firstLevel.map((br) => \u6A2A\u306E\u5272\u4ED8\u8868.get(br.id).layer1XOffset) : [minLayer1XOffset]
+  );
   const leavesOfSide = (brs) => Math.max(
     1,
     brs.reduce((sum, br) => sum + leafCountOf(br.id, /* @__PURE__ */ new Set()), 0)
   );
   const sideLaneCount = Math.max(leavesOfSide(leftBranches), leavesOfSide(rightBranches));
   const laneBandH = Math.max(0, canvasH - BRANCH_BOX_H_MAX);
-  const rowGap = sideLaneCount > 1 ? Math.min(laneBandH / (sideLaneCount - 1), \u7E26\u306E\u9593\u9694\u306E\u4E0A\u9650(layer1XOffset)) : subBranchH + 14;
+  const rowGap = sideLaneCount > 1 ? Math.min(
+    laneBandH / (sideLaneCount - 1),
+    // 帯は図で 1 つなので、**一番内側の枝** から上限を取る (#966)。
+    // 外へ出た枝に合わせると、内側に残った枝の傾きが 45 度を超える
+    \u7E26\u306E\u9593\u9694\u306E\u4E0A\u9650(\u4E00\u756A\u5185\u5074\u306E\u96E2\u308C)
+  ) : subBranchH + 14;
   const effSubH = Math.min(SUB_BOX_H_MAX, rowGap * 0.7);
   const effBranchH = Math.min(BRANCH_BOX_H_MAX, rowGap * 0.7);
   const \u7AEF\u306E\u4F59\u308A = Math.max(effSubH, effBranchH) / 2;
@@ -16253,11 +16275,11 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
     const half = nodeHalfW.get(mindData.rootId) ?? rootW / 2;
     return \u4E2D\u5FC3\u306Ex + (isLeft ? -half : half);
   };
-  const placeSubtree = (node, subDepth, isLeft, tone, placed, laneRef) => {
+  const placeSubtree = (node, subDepth, isLeft, tone, placed, laneRef, \u6A2A) => {
     placed.add(node.id);
     const dirX = isLeft ? -1 : 1;
-    const x = cx + dirX * (layer1XOffset + subOffset(subDepth));
-    const w = subDepth === 0 ? branchW : effSubW;
+    const x = cx + dirX * (\u6A2A.layer1XOffset + \u6A2A.subOffset(subDepth));
+    const w = subDepth === 0 ? branchW : \u6A2A.effSubW;
     const h = subDepth === 0 ? effBranchH : effSubH;
     const myTone = node.tone ?? tone;
     const kids = (childrenOf.get(node.id) ?? []).filter((k) => !placed.has(k.id));
@@ -16273,7 +16295,8 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
           isLeft,
           myTone ?? MIND_TONES[i % MIND_TONES.length],
           placed,
-          laneRef
+          laneRef,
+          \u6A2A
         )
       );
       y = (ys[0] + ys[ys.length - 1]) / 2;
@@ -16306,7 +16329,7 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
     const placed = /* @__PURE__ */ new Set();
     brs.forEach((br, i) => {
       const tone = br.tone ?? MIND_TONES[(toneBase + i) % MIND_TONES.length];
-      placeSubtree(br, 0, isLeft, tone, placed, laneRef);
+      placeSubtree(br, 0, isLeft, tone, placed, laneRef, \u6A2A\u306E\u5272\u4ED8\u8868.get(br.id) ?? \u679D\u306E\u6A2A\u3092\u6C7A\u3081\u308B(br));
     });
   };
   placeSide(leftBranches, true, 0);
@@ -16317,7 +16340,8 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
     let maxExtentX = rootW / 2;
     let maxExtentY = rootH / 2;
     for (const n of nodes) {
-      maxExtentX = Math.max(maxExtentX, Math.abs(n.x - cx) + n.w / 2);
+      const [\u5DE6, \u53F3] = \u63CF\u304F\u6A2A\u306E\u7AEF(n);
+      maxExtentX = Math.max(maxExtentX, Math.abs(\u5DE6 - cx), Math.abs(\u53F3 - cx));
       maxExtentY = Math.max(maxExtentY, Math.abs(n.y - cy) + n.h / 2);
     }
     const scale = Math.min(1, drawableHalfW / maxExtentX, drawableHalfH / maxExtentY);