JavaScript勉強会

JavaScriptの学習日記

JavaScriptの有向グラフ描画ライブラリー

JavaScriptマインドマップのようなグラフを描画するライブラリーを探してみました。

 

有向グラフとは?

グラフ理論 - Wikibooks

グラフ理論におけるグラフ (Graph)とは、頂点(node)と辺(edge)により構成された図形のことである。

グラフは主に、有向グラフ (directed graph)と無向グラフ (undirected graph)の2つに分類される。

有向グラフとは、頂点と向きを持つ辺(矢印)により構成されたグラフであり、無向グラフとは、頂点と辺により構成されたグラフである。

 

統計的テキスト解析(6)~語のネットワーク分析~

f:id:jsstudy:20190301223439p:plain

 

マインドマップとは?

マインドマップ - Wikipedia

マインドマップはトニー・ブザン(Tony Buzan)が提唱した思考・発想法の一つ。頭の中で起こっていることを目に見えるようにした思考ツールのこと。

描き方は、表現したい概念の中心となるキーワードやイメージを中央に置き、そこから放射状にキーワードやイメージを広げ、つなげていく。

 

f:id:jsstudy:20190301223757j:plain

 

JavaScriptマインドマップのライブラリー

JavaScript マインドマップ ライブラリー - Google 検索

 

qiita.com

 

sigma.js

sigmajs.org

 

arbor.js

arborjs.org

 

mindmup

github.com

 

js-mindmap

kenneth.kufluk.com

 

GoJS - MindMap

gojs.net

 

GoJS(HTML5 Canvas を使ったJSライブラリー)のMindMap見本

f:id:jsstudy:20190301230401p:plain

 

TOCfEの作画ツール

実際に使いたいのは、マインドマップの作画ツールではなく、TOCfEの図を作画するツールです。

 

TOCとは?

制約条件の理論 - Wikipedia

制約条件の理論(制約理論、もしくは TOC (theory of constraints) とも)は、主にサプライチェーン・マネジメントで用いられる理論の1つである。

物理学者であるエリヤフ・ゴールドラット1984年に執筆、出版した小説『ザ・ゴール』で理論体系が公開された。

 

ザ・ゴール コミック版

ザ・ゴール コミック版

 

 

TOCfE(Theory of Constraints for Education)とは?

tocforeducation.org

教育のためのTOCは、世界20か国以上の教育の場で活用されている、とてもシンプルな考えるための道具です。

この道具は、ものごとのつながりを考える「ブランチ」、意見の対立について考える「クラウド」、目標を達成する方法を考える「アンビシャス・ターゲット・ツリー」の3つで構成されています。

 

教育のためのTOCの3つの道具は、イスラエルの物理学者、エリヤフ・ゴールドラット博士によって開発されました。

この道具のベースには、ゴールドラット博士が作り上げた「制約理論(TOC:Theory of Constrains)」という理論があります。

 

考える力をつける3つの道具

考える力をつける3つの道具

 

 

 

TOCfEではこんなかんじの図を描きます。

http://w.tocforeducation.com/roadmap.html

ブランチ

f:id:jsstudy:20190301234530p:plain

 

クラウド

f:id:jsstudy:20190301234545p:plain

 

ターゲットツリー

f:id:jsstudy:20190301234556p:plain

 

ブランチ、クラウド、ターゲットツリーなどの図がササっと描けるツールがあると良いのですが、探してもすぐに見つからないので、みんな手書きでやってるのかな?と思いました。

 

HTML5 Canvas

もしも、TOCfEの図をデジタルデータ化するなら、HTML5JavaScriptで作図できないかな?と思いました。

 

developer.mozilla.org

 

qiita.com

 

 

上記のグラフ関係のライブラリーを改造すれば、TOCfEの作画ツールも作れるような気がしました。

とりあえず、手書きでやってみて、デジタルツールが必要になったら作ってみたいです。