QiitaにUMLを載せられるようにPlantUMLつかってWebサービス作ろうと思ったら本家にあった話

はじめに

仕事ではPlantUMLを使っています。GitLabの場合は、コードを書けば図に変換して表示してくれるので便利です。しかしQiitaではそうもいかないので、PlantUMLで書いたコードを図に変換してくれるサーバーを書こうかと思っていました。

...ら、本家に既にありました。

PlantUML Server

• http://www.plantuml.com/plantuml

まずURLを取得

• http://www.plantuml.com/plantuml にアクセス
• PlantUMLでUMLを書く
• View as PNG / View as SVG からリンクをコピー

下記のようにQiitaに記載

• コピーしたURL : http://www.plantuml.com/plantuml/{format}/{ENCODED}
• format : svg とか png とか
• ENCODED : 書いたコードをハッシュしたようなもの

[![alt](http://www.plantuml.com/plantuml/{format}/{ENCODED})](http://www.plantuml.com/plantuml/uml/{ENCODED})

サンプル

[![alt](http://www.plantuml.com/plantuml/svg/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000)](http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000)

結果

• こうなる
• 画像をクリックすると本家に飛んで、元のコードが見れる
• URLはコードのハッシュなので、コードを変更するとURLも変わる点に注意
• ハッシュではあるものの、履歴も一応残せる

2017/05/18　追記

こんなもの作りました。
QiitaにUMLを貼れるようにChrome拡張機能を作った - Qiita