ビジネスモデル図解ツールっぽいものをSVGで実装してみる

最近twitterやnoteで話題になっている、ビジネスモデル図解。

note.mu

以前から面白いなーと思って見ていたら、先日チャーリーさんがこんなことを呟いていました。

ビジネスモデル図解をブラウザ上でかんたんに編集できるようにして、業種とかタグとかつけて誰でもアップロードできるようにしたい。ソート、検索もできる。日本だけじゃなく世界中からおもしろいビジネスモデルがどんどん集まってくる仕組み。それを愛でる。なんて俺得。開発興味ある人いないかな。
— チャーリー (@tetsurokondoh) 2018年7月19日

とても良い。
個人が作るだけではなくて、それを共有して図解を中心としたコミュニケーションがとれるコミュニティを作れたら、それはきっと楽しそうな気がする。

と考えているうちに作ってみたくなってきた。
まずはフロント部分だけ。
矢印が必要だからSVGで。
実用性や綺麗さは置いておこう。

という訳で作ってみた

創作意欲が沸いたので、Vue.jsを使ってSVGで図解ツールを実装してみました。
（保存・共有はできず、制限も多いため実用性は皆無です）

https://masaoblue.github.io/business_zukai_svg/index.html

利用イメージ
f:id:MasaoBlue:20180724073445p:plain