【PlantUML】ConfluenceでPlantUMLを使ってみた

この記事は現役ウェブディベロッパーがわかりやすさにこだわって作成しました

この記事はこちらのサイトを参考にさせていただきました

Confluence上でPlantUMLを使ってER図をテキストベースで作成する - Qiita
#背景外部キー制約が完璧に作成されている環境であれば、リバースエンジニアリングで自動でER図を作成してくれるツールは結構あるかと思います。ただし、外部キー制約がメンテされていない環境だと、手動で…

はじめに

ドキュメントを共有するにはConfluenceは最強のツールです。だた、図を描くのにGUIのLucid Chartは大変便利ですが、ネットワーク環境が良くない場所だと動きが遅く作業がはかどらないことがままあります。

VisualCodeなどではPlantUMLというCUIで図を描くことができるツールがあり以前からウェブでこれが利用できないかと思っていたところ、Confluenceで使えるという記事を見つけました。記事では、PlantUMLを使ってテキストベースでER図を作成する方法が紹介されていましたので、そこから引用させていただきました

使い方

Confluence上でPlantUMLを使ってER図を作成する方法をご紹介します。
1.記事を書く画面で「+」→「その他のマクロ」

2. PlantUMLマクロを選択

3.「挿入」を押す

4.↓の枠がでてくるので、この中にER図描画用の情報を記入すればOK。コンフルを保存すれば、ER図ができあがり。

テンプレート

@startuml
' ER図を見やすくするための設定
' monotone color
skinparam monochrome true
' shadow off
skinparam shadowing false
' change font
skinparam defaultFontName Ricty Diminished
' hide the spot
hide circle
' avoid problems with angled crows feet
skinparam linetype ortho

' 1. table list
object table1
object table2
object table3

' 2. column list
table1 : column1_1
table1 : column1_2
table2 : column2_1
table2 : column2_2
table3 : column3_1
table3 : column3_2
table3 : column3_3

' 3. relation list
table1 }o--||  table2: (column1_1=column2_1)
table1 ||--o{ table3 : (column1_2=column3_1)

@enduml

大きく分けて3つのブロックに分かれており、
– テーブルリスト
– カラムリスト
– リレーション
をそれぞれ列挙すればOKです。

↓こんな感じで出力されます。

image.png

補足的にJOINの条件を (column1_1=column2_1)といったテキストで表示させています。(これは無くすこともできます)

リレーションのバリエーション

リレーションのバリエーションは↓ですべてカバーできると思います。

N:1
Member }o--||  TPref: (mePrefID-prPrefID)
Member }|--||  TPref: (mePrefID-prPrefID)

1:N
Member ||--o{  TPref: (mePrefID-prPrefID)
Member ||--|{  TPref: (mePrefID-prPrefID)

1:1
Member ||--||  TPref: (mePrefID-prPrefID)
Member |o--||  TPref: (mePrefID-prPrefID)
Member ||--o|  TPref: (mePrefID-prPrefID)


N:N ※基本的にないはず
Member }o--o{  TPref: (mePrefID-prPrefID)
Member }|--|{  TPref: (mePrefID-prPrefID)

構文エラー時

エラーがあると↓のような画面が表示されるため、エラーメッセージを参考にデバッグします。

PHP/Javascript/WORDPRESS案件全般承ります

この記事についてのご質問またはお困りのことがございましたら、お気軽にお問い合わせください。

タイトルとURLをコピーしました