====== EclipseでPlantUMLを使いER図を作成する ====== Eclipse Version 2019-12 \\ PlantUML Plug-in Version 1.2019.11 \\ graphviz Version 2.46.0 --- //[[http://www.y2sunlight.com|y2sunlight]] 2021-02-11// [[eclipse:top|Eclipse に戻る]] 関連記事 * [[eclipse:2019-12|Eclipse 2019-12のインストールと設定]] リンク * https://plantuml.com --- PlantUML(本家) * https://ja.wikipedia.org/wiki/PlantUML ---Wikipedia * https://plantuml.com/ja/eclipse --- PlantUMLによるEclipseプラグインの紹介 graphviz関連のリンク * https://graphviz.org/ --- PlantUMLで使用されているグラス視覚化ツール * http://www.graphviz.org/documentation/ --- DOT言語、コマンドラインの使い方 * [[https://ja.wikipedia.org/wiki/DOT%E8%A8%80%E8%AA%9E|DOT言語について]] --- Wikipedia PlantUMLは、UMLダイアグラムなどを作成するための[[https://ja.wikipedia.org/wiki/%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E5%9B%BA%E6%9C%89%E8%A8%80%E8%AA%9E|ドメイン特化言語(DSL)]]です。PlantUMLはクロスプラットホームで使えるため、多様な開発環境を有しているグループでの開発に威力を発揮すると思います。テキストベースの言語なので、GitHubなどのリポジトリでも簡単に共有できます。 PlantUMLでは以下のダイアグラムをサポートしています。 * UML --- シーケンス図, ユースケース図, クラス図, オブジェクト図, アクティビティ図, コンポーネント図, 配置図, 状態遷移図, タイミング * その他 --- JSON, YAML, ネットワーク図, ワイヤーフレーム, アーキテクチャ図, 仕様及び記述言語 (SDL), Ditaa, ガントチャート, マインドマップ, WBS図, 数学的記法(AsciiMath、JLaTeXMath), ER図 PlantUMLをサポートしている興味ある製品を以下に示します。(その他の製品については、[[https://ja.wikipedia.org/wiki/%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E5%9B%BA%E6%9C%89%E8%A8%80%E8%AA%9E|Wikipedia]]を参照して下さい。) * IDE プラグイン --- Eclipse, IntelliJ IDEA, NetBeans * OfficeSuite 拡張機能 --- LibreOffice Writer, Microsoft Word * その他 --- Google Docs(PlantUML Gizmo), LaTeX(PGF/TikZパッケージ), MediaWiki(プラグイン) 本編では、EclipseでPlantUMLを使ってER図を書くことに主眼を置いていますが、勿論、クラス図、シーケンス図などの他のダイアグラムを書くこともできます。 ----- ===== Graphviz のインストール ===== PlantUMLで記述した様々なダイアグラムをレンダリングするには図形プロセッサが必要になりますが、それがグラス視覚化ツール[[https://graphviz.org/|Graphviz]]です。 ==== パッケージのダウンロード ==== 以下の Graphviz のサイトにアクセスして下さい。 * https://graphviz.gitlab.io/ [{{:eclipse:plant-uml:plant-uml-install01.png?nolink}}] ■ [Download]ボタンをクリックします。\\ ■ Downloadページから[Windows]用の以下のパッケージをダウンロードします。 == Windows == 2.46.0 for Windows 10 (64-bit): stable_windows_10_cmake_Release_x64_graphviz-install-2.46.0-win64.exe (not all tools and libraries are included) \\ ==== インストール ==== ダウンロードした以下のファイル(インストーラ)を実行します stable_windows_10_cmake_Release_x64_graphviz-install-2.46.0-win64.exe [{{:eclipse:plant-uml:plant-uml-install02.png?nolink}}] ■ [次へ]を押します。 [{{:eclipse:plant-uml:plant-uml-install03.png?nolink}}] ■ [同意する]を押します。 [{{:eclipse:plant-uml:plant-uml-install04.png?nolink}}] ■ GraphvizのPATH環境変数への追加を選択して下さい。(コマンドプロンプトから実行するの必要です)\\ ■ また、デスクトップアイコンの作成の有無を聞かれるのでお好みで設定して下さい。\\ ■ [次へ]ボタンを押します。 [{{:eclipse:plant-uml:plant-uml-install05.png?nolink}}] ■ インストールフォルダを聞かれるのでお好みで設定して下さい。(分からない場合はそのままで)\\ ■ [次へ]ボタンを押します。。 [{{:eclipse:plant-uml:plant-uml-install06.png?nolink}}] ■ Graphvizのメニューへの追加について聞かれるのでお好みで設定して下さい。(分からない場合はそのままで)\\ ■ [インストール]ボタンをを押します。 ■ インストールが終わったら[完了]ボタンをクリックします。 \\ ==== Graphvizのテスト ==== Graphvizは[[https://ja.wikipedia.org/wiki/DOT%E8%A8%80%E8%AA%9E|DOT言語]]を視覚化するソフトウェアです。GraphvizのDOT言語に関する情報は、以下を参照して下さい: * http://www.graphviz.org/doc/info/lang.html --- GraphvizのDOT言語 また、Graphvizのコマンドに関する情報は以下をご覧下さい: * http://www.graphviz.org/doc/info/command.html --- Graphvizのコマンドラインの使い方 適当な場所に以下のDOT言語を ''foo.dot'' として保存します。 {{fa>file-o}} ''D:\temp\foo.dot'' graph { X -- Y Y -- Z } ファイルを保存したフォルダで以下のコマンドを実行します: D:\temp> dot -Tsvg foo.dot -o foo.svg ■ ''-T''オプションの後には出力するファイルの種類を指定します。 \\ ■ ''-o''オプションの後には出力するファイル名を指定します。 結果は以下のようなsvgファイルが出力されます。 [{{:eclipse:plant-uml:plant-uml-foo.png?nolink}}] \\ ===== Eclipseプラグインのインストール ===== Eclipseを起動し、[ヘルプ][新規ソフトウェアのインストール]を選択します。 [{{:eclipse:plant-uml:plant-uml-install10.png?nolink}}] ■ [追加]ボタンをクリックします。 [{{:eclipse:plant-uml:plant-uml-install11.png?nolink}}] ■ リポジトリの名前とロケーションを入力して[追加]を押します。 * 名前 --- ''plantuml'' * ロケーション --- ''http://hallvard.github.io/plantuml/'' [{{:eclipse:plant-uml:plant-uml-install12.png?nolink}}] ■ 全ての項目を選択し、[次へ]を押します。 * ''PlantUML Eclipse support'' * ''PlantUML Library'' 以降は画面の指示に従ってインストールを完了して下さい。 インストールが終了したら、メインメニューの[ウインドウ][設定]をクリックし、左ペインから[PlantUML]を選択します。 [{{:eclipse:plant-uml:plant-uml-setup01.png?nolink}}] ■ graphviz が正しく認識できていれば「**Installation seems OK. File generation OK**」と表示されます。graphviz をデフォルトフォルダ以外にインストールした場合は、ここで指定して下さい。 \\ ===== EclipseでER図を作成 ===== それでは、EclipseでER図を作ってみます。 Eclipseで任意のプロジェクトを開き、以下のようなファイルを作ります。 @startuml Entity01 }|..|| Entity02 Entity03 }o..o| Entity04 Entity05 ||--o{ Entity06 Entity07 |o--|| Entity08 @enduml メインメニューの[ウィンドウ][ビューの表示][その他]をクリックし [PlantUML][PlantUML]を選択します。入力したPlantUMLのテキストをアクティブにすると[PlantUML]のビューにER図がプレビューされます。 [{{:eclipse:plant-uml:plant-uml-usage01.png?nolink}}] ■ [PlantUML]のビューの中でマウスを右クリックして[エクスポート]を選択するとファイル(svg/jpeg/png/gif)に出力する事ができます。 以下は、もう少し複雑なER図の例です。 @startuml ' hide the spot hide circle ' avoid problems with angled crows feet skinparam linetype ortho entity "Entity01" as e01 { *e1_id : number <> -- *name : text description : text } entity "Entity02" as e02 { *e2_id : number <> -- *e1_id : number <> other_details : text } entity "Entity03" as e03 { *e3_id : number <> -- e1_id : number <> other_details : text } e01 ||..o{ e02 e01 |o..o{ e03 @enduml [{{:eclipse:plant-uml:plant-uml-usage02.png?nolink}}] PlantUMLによるER図の書き方については、以下を参照して下さい: * https://plantuml.com/ja/ie-diagram --- ER図の文法 PlantUMLのER図は、クラス図の派生物的な扱いなので、クラス図に関する書き方がそのまま利用できます。 * https://plantuml.com/ja/class-diagram --- クラス図の文法 \\