Skip to content

ドキュメント

「ドキュメント」は .gg ファイル内で、アイコン・コネクタ・リージョン・ ノート以外の部分 — つまり 図版全体の設定cols / rows / テーマ / icons など)を、1 つまたは複数の doc { … } ステートメントで運ぶ 層です。

doc { … } ステートメント

gg
doc {
  cols: 3, rows: 3,
  theme: { primary: '#1e3a5f', accent: '#e8792f' },
  icons: {
    logo: './assets/logo.svg',
  },
}

中身は厳密な JSON ではなく JSON5。以下が使えます:

  • アンクオートキーcols: 3 で OK("cols" 不要)
  • 末尾カンマ — リスト・オブジェクトの末尾に , を置ける
  • // コメント// JSON5 のコメント
  • シングルクォート文字列'#1e3a5f'"…" も可

厳密な JSON は JSON5 の真部分集合なので、既存の JSON はそのまま通ります。

1 ファイルに複数 doc

同じ .gg 内に doc ブロックをいくつ置いても構いません。ファイル上の 出現順に合体され、後勝ち になります。配列は concat、スカラーと オブジェクトはディープマージ:

gg
doc { cols: 4 }

# … DSL …

doc {
  theme: { accent: '#d97706' },
}

最終的な DiagramDef には colstheme.accent の両方が反映 されます。詳細な規則は マージ 参照。

5 つのコマンド

.gg の各行は次のキーワードから始まります(コネクタを除く — コネクタは <id> <arrow> <id> の形):

コマンド役割
doc図版全体の設定(テーマ / cols / icons など)
iconアイコン付きノードの宣言
region背景のカラーゾーン
note注釈吹き出し

コネクタはキーワードで始まりません。Gridgram は 2 番目のトークンが 矢印かどうかで判定します。

doc ボディに書けるキー

DiagramDef の最上位フィールドはすべて受け付けます:

キー役割
cellSizeセルあたりのピクセル数(既定 256
paddingSVG 外側の余白(cellSize から自動スケール)
cols / columns列数(省略時は自動推論)
rows行数(省略時は自動推論)
themeカラーパレット
iconsbare-name → SVG のマップ(カスタムアイコン)
nodesノード配列(通常は icon DSL 推奨)
connectorsコネクタ配列(通常は DSL 推奨)
regionsリージョン配列(通常は region DSL 推奨)
notesノート配列(通常は note DSL 推奨)

コメント

.gg#// による 行コメント が使えます:

gg
# section: public layer
icon :web @A1 tabler/world "Web"   // 外部に公開

次に読む

  • グリッドcols / rows / cellSize / 自動推論
  • マージ — 複数 doc ブロック、ディープマージ、 DSL と JSON の使い分け
このページを編集Last updated: