Skip to content

重なるペア

ちょうど 2 本 のコネクタが順序を問わない同じ端点ペアを共有した 場合(a → bb → a も「重複」とみなします)、gridgram はそれぞれ のノード円の上で 接続点の角度を左右対称にずらして 並列の 2 本に 振り分けます。線そのものは直線のまま、ノードから出る位置だけが少し ずれるイメージです。

この処置が働くのは、ペアの両方がそのままでは直線として重なって描画 される場合のみです。waypoints: [...] が明示されたコネクタや、ルータ がノードを避けて曲げたコネクタは対象外になります — 著者が経路を決めて いる、あるいは既に経路が分岐しているからです。

conn-overlap-split (SVG, frame 1)

各ノードペアには 対向する 2 本a --> b "req"b --> a "ack") を宣言しています。矢印の向きが互いに逆でも順序を問わない同じ端点ペア なので、gridgram は両方を自動分割し、reqack の接続点を円周上 の反対側に振り分けて並列の 2 本に並べます。E / N / W / S と 4 つの 斜め方向、計 8 方向のいずれでも同じパターンで動作します。

ジオメトリ

線は 完全な直線のまま です。変わるのは各ノードの円との接続位置 だけです。

            ╱─── req ───╲
node A ┤ ±15° で回転   ├ node B
            ╲─── ack ───╱
  • ペアの各メンバーは参加する両端のノード円上で接続点を 15° だけ 対称方向に回転させます。
  • 既定の円形ノード(半径 = cellSize の 22.5%)では、2 本の間の 垂直距離は cellSize の約 12% になります — 並んでいると分かる ぐらいの間隔です。
  • 回転はアルファベット順に正規化した端点ペアの基準軸で計算されるため、 矢印が a → b でも b → a でも見た目上、軸の反対側に振り分け られます。

ポリラインは 1 本の直線のままなので、コネクタラベル・JSON 出力・下流 の処理はいずれも通常通り扱えます。変化するのは SVG の端点位置だけ です。

ラベルは直線に沿う

コネクタのラベルは回転後の直線に対して、通常の直線コネクタと同じ 候補セグメント探索で配置されます。著者側で特別な指定は不要です。

3 本以上の重複はエラー扱い

自動分割は 2 本のときだけ成立する措置です。3 本以上が同じ端点ペアを 共有した場合、gridgram は すべてを直線として描画 します(先頭 2 本 は重なります)。そのうえで 3 本目以降 をエラー色で表示し、 connector-overlap 診断を出力します。診断には、重複を解消するか 中継点で経路をずらすかの提案が含まれます。

gg
a --> b "first"
a --> b "second"
a --> b "third"   # エラー色 + 診断

回避策は、コネクタを 2 本以下に減らすか、余ったコネクタに明示的な 中継点を与えて経路を分けることです。

gg
a --> b "first"
a --> b "second"
a --> b "third" {
  waypoints: [{ col: 2, row: 1.5 }],
}

オプトアウト

ペアの片方でも waypoints: [...] を明示している場合、自動分割は適用 されません。明示的な経路指定が著者の意図として尊重され、もう一方は 通常の直線として描かれます。「片方は決まった経路を通したい、もう片方 は直線でよい」というケースで使えます。

このページを編集Last updated: