Skip to content

ギャラリー

アプリケーション領域ごとに整理した .gg 図の集成です。どの例も ライブレンダリング — 以下の gg-diagram フェンスブロックは ビルド時にパース・解決・描画されます。

目的は「範囲の広さ」を示すこと。Gridgram の DSL は当初想定された 「クラウドアーキテクチャの箱と矢印」の用途をはるかに超えて機能 します。ここに集めた例は全体として、リージョン・ノート・バッジ・ 破線・テーマ上書き・中継点・sizeScalelabelScale など、あらゆる 機能を行使します。カテゴリを通読すれば機能ツアーにもなります。

領域

技術 & エンジニアリング

ビジネス & 人

オペレーション & 物流

  • サプライチェーン — 上流 / 生産 / 下流、返品
  • 倉庫 — ゾーンレイアウト、ピック&パック経路
  • 製造 — ラインの各工程、品質ゲート
  • 配送 — ハブ&スポーク、ラストマイル、返品

知識 & コミュニケーション

ギャラリーの描画方法

各ページは gg-diagram フェンス付きコードブロックを使用します。 docs/.vitepress/plugins/gg-diagram.ts プラグインがビルド時に すべてのフェンスをパースして得られた SVG をインライン化するので、 ギャラリーは生の .gg テキストをブラウザに送らず — 描画済みの 図が直接表示されます。

このモードで使えるのは Tabler 組み込みとインライン生 SVG のみで、 @alias/ パス・URL・ファイル参照はスキップされます(markdown-it から await できない非同期ローダが必要になるため)。これらを 独自ページで使いたい場合は examples/<name>/ エントリを追加し、 <Example> コンポーネントを利用してください。

このページを編集Last updated: