轉自: https://blog.csdn.net/wei549434510/article/details/79587441
在 VS Code中安裝Markdown Preview Enhanced插件後,在Mrakdown使用PlantUML文法畫相關UML圖的不顯示的問題
利用Markdown Preview Enhanced使用PlantUML文法:
1、PlantUML的圖形預覽依賴于Graphviz軟體。Windows版下載下傳
2、配置環境變量
安裝好Graphviz後(比如我安裝在:D:\Software\Graphviz),添加環境變量:
變量名:GRAPHVIZ_DOT
變量值:D:\Software\Graphviz\bin\dot.exe
注:變量值是根據我的安裝目錄配置的。
這樣,可以使用PlantUML文法顯示圖形了。
使用VS CODE+PlantUML高效畫圖
PlantUML是一個快速建立UML圖形的元件,官網上之是以稱它是一個元件,我想主要是因為多數情況下我們都是在Eclipse、NetBenas、Intellijidea、 Emacs、Word、VS CODE、Sublime等軟體裡來使用PlantUML(參看各軟體相關配置)。
PlantUML支援的圖形有:
- sequence diagram,
- use case diagram,
- class diagram,
- activity diagram (here is the new syntax),
- component diagram,
- state diagram,
- object diagram,
- wireframe graphical interface
PlantUML通過簡單和直覺的語言來定義圖形,它可以生成PNG、SVG和二進制 圖檔。下面是一個簡單的示例:
@startuml
Bob -> Alice : Hello, how are you
Alice -> Bob : Fine, thank you, and you?
@enduml
安裝plantuml
plantuml實際上是安裝的插件(VS CODE插件),需要graphviz渲染畫圖,以及需要安裝java支撐plantuml運作
- 首先你需要安裝VS CODE,一般都有
- 安裝plantuml插件
- 去 graphviz官網下載下傳其安裝包
- 安裝java
安裝好之後,建立一個檔案,使用上面的示例,拷貝之後,在win32下是alt+d,mac下是command+d即可生成相關uml圖
将腳本導出成圖檔
在腳本處右鍵,即有導出圖檔的選項
文法
文法可以參照這篇文章,非常詳細
http://archive.3zso.com/archives/plantuml-quickstart.html#sec-5-1
或者想快速用可以參考這篇,比較簡略
http://www.jianshu.com/p/e92a52770832