@cardenelabs/cdl 0.113.0 → 0.115.0

package/CHANGELOG.md

@@ -5,6 +5,74 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.115.0] - 2026-09-30
+
+### Fixed
+
+- **木の兄弟どうしが遠くへ離れ、離れた 2 本の列に見えた** (#968)
+
+  葉は `canvasW / 葉の数` で等分した区画の中央に置かれていた。
+  区画は箱より広いので、葉が少ない図では兄弟が区画の幅だけ離れる。
+  見本帳の `配布物の構成` は葉が 2 枚で、箱の縁の間が 196 空いていた。
+  同じ図の段と段の隙間は 95 なので、横だけが縦の 2 倍になる。
+
+  横の隙間を **段と段の隙間に揃えた**。
+  木は根から下へ辿る図なので、間隔が 1 つの調子で揃っていないと系統が読めない。
+
+  | 図の形 | 横の隙間 (直す前 → 後) | 縦の隙間 |
+  |---|---|---|
+  | 葉 2 枚 | 196 → 95 | 95 |
+  | 葉 3 枚 | 84 → 84 (変わらない) | 95 |
+
+  **今より広げない**。 葉が多い図では区画の方が狭いので、そちらが効いて位置は動かない。
+  頭打ちを外すと間隔が区画の 3 倍になり、最後の一様縮小が効いて箱まで小さくなる
+  (実測 = 葉 10 枚の図で箱の幅が 57.1 から 19.5 に縮んだ)。
+
+  箱の幅を出す処理を置き場所より先に回した。
+  端の葉がどれだけ幅を取るかは、名前と段から決まるので位置より先に出せる。
+
+  見本帳 (`cardene777/dragon`) の `配布物の構成` は、札に対する中身の割合が
+  横 66% から 52% に **下がる**。 兄弟が近づいたぶん中身が小さくなるためで、
+  図が札の中で浮くのは札の大きさの話として別に扱う。
+
+## [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
@@ -4512,7 +4580,9 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.113.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.115.0...HEAD
+[0.115.0]: https://github.com/cardene777/cdl/compare/v0.114.0...v0.115.0
+[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

package/dist/index.cjs

@@ -15931,6 +15931,28 @@ function computeTreeLayout(treeNodes, canvasW, canvasH) {
     const \u8981\u308B = measureTextWidth(\u540D\u524D.text, { fontSize: \u540D\u524D.fontSize}) + (nodeW - \u4F7F\u3048\u308B\u5E45(nodeW));
     return Math.min(Math.max(\u8981\u308B, nodeW), slotW * 0.92);
   };
+  const \u8449\u306E\u4E26\u3073 = [];
+  const \u6BB5\u306E\u8868 = /* @__PURE__ */ new Map();
+  const \u5E45\u306E\u8868 = /* @__PURE__ */ new Map();
+  {
+    const \u898B\u305F = /* @__PURE__ */ new Set();
+    const \u4E0B\u898B = (n, depth) => {
+      \u898B\u305F.add(n.id);
+      \u6BB5\u306E\u8868.set(n.id, depth);
+      \u5E45\u306E\u8868.set(n.id, \u7BB1\u306E\u5E45(n, depth));
+      const kids = (childrenOf.get(n.id) ?? []).filter((k) => !\u898B\u305F.has(k.id));
+      if (kids.length === 0) {
+        \u8449\u306E\u4E26\u3073.push(n.id);
+        return;
+      }
+      for (const k of kids) \u4E0B\u898B(k, depth + 1);
+    };
+    for (const r of roots) if (!\u898B\u305F.has(r.id)) \u4E0B\u898B(r, 0);
+  }
+  const \u8449\u306E\u6570 = Math.max(\u8449\u306E\u4E26\u3073.length, 1);
+  const \u6BB5\u306E\u9699\u9593 = depthGap - nodeH;
+  const \u8449\u306E\u9593\u9694 = Math.min(slotW, nodeW + \u6BB5\u306E\u9699\u9593);
+  const \u8449\u306Ex = (i) => canvasW / 2 - (\u8449\u306E\u6570 - 1) * \u8449\u306E\u9593\u9694 / 2 + i * \u8449\u306E\u9593\u9694;
   const posOf = /* @__PURE__ */ new Map();
   const nodes = [];
   const placed = /* @__PURE__ */ new Set();
@@ -15940,7 +15962,7 @@ function computeTreeLayout(treeNodes, canvasW, canvasH) {
     const kids = (childrenOf.get(n.id) ?? []).filter((k) => !placed.has(k.id));
     let x;
     if (kids.length === 0) {
-      x = leafCursor * slotW + slotW / 2;
+      x = \u8449\u306Ex(leafCursor);
       leafCursor += 1;
     } else {
       const xs = kids.map((k) => place(k, depth + 1));
@@ -15954,7 +15976,7 @@ function computeTreeLayout(treeNodes, canvasW, canvasH) {
       ...n.subtitle !== void 0 ? { subtitle: n.subtitle } : {},
       x,
       y,
-      w: \u7BB1\u306E\u5E45(n, depth),
+      w: \u5E45\u306E\u8868.get(n.id) ?? \u7BB1\u306E\u5E45(n, depth),
       h: nodeH,
       depth,
       ...n.unresolved ? { unresolved: true } : {}
@@ -16141,7 +16163,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,38 +16236,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 \u8449\u306E\u540D\u524D\u306E\u6700\u5927\u5E45 = Math.max(
-    0,
-    ...firstLevel.filter((br) => (childrenOf.get(br.id) ?? []).length === 0).map((br) => {
-      const \u540D\u524D = \u653E\u5C04\u306E\u884C({ title: br.title, isRoot: false })[0];
-      return measureTextWidth(\u540D\u524D.text, { fontSize: \u540D\u524D.fontSize});
-    })
-  );
-  const \u540D\u524D\u3067\u6C7A\u307E\u308B\u4E0A\u9650 = canvasW / 2 + branchW / 2 - \u8449\u306E\u540D\u524D\u306E\u6700\u5927\u5E45;
-  const layer1XOffset = Math.max(minLayer1XOffset, Math.min(\u540D\u524D\u3067\u6C7A\u307E\u308B\u4E0A\u9650, 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;
@@ -16261,11 +16297,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));
@@ -16281,7 +16317,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;
@@ -16314,7 +16351,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);