preタグに書いたデータをダイアグラムとしてビジュアル化するスクリプト・「Pinker.js」Pinker.jsはpreタグに書いたデータをcanvasにダイアグラムとして描いてくれるスクリプトです。 特定のルールに沿った書き方をpreタグにする事で簡易的なダイアグラムを生成できる、というもの。割と複雑なものも書けるみたいです。 以下動作サンプルです。 動作サンプル 左のpreタグのテキストを元に右のcanvasタグにダイアグラムが生成されています。 使い方Pinker.jsを読み込みます <script src='Pinker.js'></script>preにルールに沿った記法で書き、idを振ります。Layout:で位置を決め、Relate:で関係性を設定します。 <pre id="Source01">Layout: [A] [B][D][E] [C]...[F] Relate: [B]->[A],[C] [D]->[B],[E],[F] </pre>canvasを
