cytoscape.js を用いたインタラクティブなグラフ描画の実装 - Qiita

はじめに ちょっとしたネットワークグラフを書きたいとき、graphviz、plantUML、blockdiag等は便利ですが、細かい調整をしようとすると泥沼にハマります。😅しかし、drawi.io などで１からネットワークグラフを書くのはしんどい。そこで「良きに計らえ」でいい感じでだいたいノードをレイアウトしてもらって、その後手動でノードを動かして最終形にするのが一番効率がよいと思われます。 このようなインタラクティブなグラフ作成をしたいとき、cytoscapeのような本格的なデスクトップアプリもありますが、ウェブサービスで実現したいときは cytoscape.js を使うとよいと思われます。 本記事では cytoscape.js を用いて上記を実現する方法を紹介したいと思います。 描画するグラフデータについて 描画するネットワークの元データとしては、DBpediaを利用しています。ここ