Graphviz:組織図を作ってみよう

組織図には、明確なルールはありませんが、大抵の場合、上もしくは左に上位の階位をおくことが多いそうです。

それでは、鷲のマークでおなじみのショッカーの組織図を作ってみましょう

ショッカーというのは「仮面ライダー」に登場する世界征服を企む謎の国際的秘密組織です。

code:d3.js

const graph = ` graph g {

ratio=auto;

fontname="Sans";

label="ショッカー組織図";

// ここにノードを追加する

まず、首領がいて本部があります。本部のことはわからない点が多いのです。例えば、本部の所在地は不明です。

code:d3.js

"首領" -- "本部";

本部の下に支部があります。日本を担当するのが日本支部です。

code:d3.js

"本部" -- "日本支部";

支部は他に、

モロッコ支部

ジブラルタル支部

シンガポール支部

香港支部

などがあるらしいです。

code:d3.js

"本部" -- {"モロッコ支部" "ジブラルタル支部" "シンガポール支部" "香港支部" }

日本支部を統括するのは大幹部です。当初はこの役職はありませんでした。

で、大幹部の配下に幹部（怪人）がおりまして、さらに、その下に戦闘員がいるという

code:d3.js

"日本支部" -- "大幹部";

"大幹部" -- "幹部（怪人）A" -- "戦闘員Aグループ";

"大幹部" -- "幹部（怪人）B" -- "戦闘員Bグループ";

"大幹部" -- "幹部（怪人）C" -- "戦闘員Cグループ";

そういう構図ですね。

code:d3.js

}

`

はい、トップダウンで横のつながりがほとんどない、ショッカーの組織構造が明らかになりました。

code:d3.css

/* */

code:d3.js

d3.select("#graph").graphviz()

.fade(false)

.renderDot(graph);

https://plantuml-proxy.vercel.app/svg/https://scrapbox.io/api/code/suto3/Graphviz:組織図を作ってみよう/shockker06.pu#.svg

code:shockker06.pu

@startdot

graph s{

ratio=auto;

label="ショッカー組織図";

"首領" -- "本部";

"本部" -- "日本支部";

"本部" -- {"モロッコ支部" "ジブラルタル支部" "シンガポール支部" "香港支部"}

"日本支部" -- "大幹部";

"大幹部" -- "幹部（怪人）A" -- "戦闘員Aグループ";

"大幹部" -- "幹部（怪人）B" -- "戦闘員Bグループ";

"大幹部" -- "幹部（怪人）C" -- "戦闘員Cグループ";

}

@enddot