on:2013年7月16日sponsorsテキストからSVGのUMLシーケンス図にするシンプルなJavaScriptのライブラリを紹介します。シーケンス図は手書き風のゆる〜い感じのから、かちっとしたのも描けます。DiagramsのデモデモではさまざまなUMLシーケンス図があります。元となるテキストはこんな感じです。テキスト上記のテキストデータを元にシーケンス図に変更します。シーケンス図はSVGでダウンロードが可能です。手書き風のゆる〜い感じのシーケンス図かちっとしたのも描けます。したシーケンス図デモのテキストは変更できるので、日本語で試してみました。手書き風はフォントがないとダメみたいです。デモでは他にもいろいろあります。Diagramsの実装には、「Underscore.js」と「Raphaël」が必要です。HTMLシーケンス図を描画するエリアを確保します。JavaScriptスクリプトでテキストを書き、実行します。'hand'});</script>jQueryを使用すると、下記のようになります。