fc2ブログ
    フリーソフトで3分で描くユークリッド原論の命題関連図/人文系のためのグラフ表現 フリーソフトで3分で描くユークリッド原論の命題関連図/人文系のためのグラフ表現 読書猿Classic: between / beyond readers このエントリーをはてなブックマークに追加
    の続きである。


    クリッカブルなチャートをつくる

    先の記事で消化した、グラフ(有向グラフとかダイアグラムとか)を記述するための言語、dot言語で書いたスクリプトの中にはURLを埋める事ができる。


     digraph{

     //ノードにリンクをつける

     孔子 [href="http://ja.wikipedia.org/wiki/孔子"];
     子路 [href="http://ja.wikipedia.org/wiki/子路"];

     //エッジにリンクをつける

     孔子 -> 子路 [label = "師弟関係", href="http://ja.wikipedia.org/wiki/師弟" ];

     }


    dot言語で書かれたスクリプトを、グラフに変換する(図示する)ソフトGraphvizで、描かれたダイアグラムをクリックすると、リンク先のサイトがブラウザで開かれる。
    またsvgかpdfで書き出したファイルでも、このリンクは生きている。



    このブログからだと直接飛べないようなので、上の画像をクリックして別窓で開いてから、図の中の「孔子」「子路」「師弟関係」をそれぞれクリックしてほしい。


     この機能を使えば、たとえば論文の参照関係を示す有向グラフに、それぞれの論文へのリンクをつけることが出来る。例は、オピオイド(モルヒネ様物質)受容体についての初期研究の参照関係を表すネットワーク図(原論文へのリンク付き)。

    (クリックで別窓にsvgファイルが開くので、そこでノードをクリックすると原論文が開く)



     前の記事の最後に書いた対戦型哲学史 対戦型哲学史 このエントリーをはてなブックマークに追加についても、クリッカブルなネットワーク図に、登場するすべての哲学者とその間の全対戦をまとめてみた。


    fight-map.png
    (上の図は一部。クリックで別窓に全体図が表示)


    哲学者の名前をクリックするとその哲学者が参加する全対戦リストが表示され、哲学者同士をつなぐエッジにつけられた対戦タイトル(たとえば老子とF.ベーコンとの間なら「技術とユートピア」というのがそれ)をクリックすると、当該対戦のカードが表示される。

     この機能をつかえば、
    これまで地上に現れたすべての思想ideasのつながりを1枚にまとめたインフォグラフィック 読書猿Classic: between / beyond readers これまで地上に現れたすべての思想ideasのつながりを1枚にまとめたインフォグラフィック 読書猿Classic: between / beyond readers このエントリーをはてなブックマークに追加
    で出てきた思想家マップに、はてブコメントにあった、各思想家からのWikpediaへのリンクをつけられそうだ。やってみたのが下のもの。

    AllInflu.png
    (上の図は一部。クリックで別窓にdocs.google.comにて全体図が表示)
    docs.google.comに上げてみたが、大きすぎるので、ちゃんと見るためには左上の↓をクリックしてpdfファイル(All Influences Wikipedia.pdf 1.4MB)をダウンロードした方がよい。思想家名からWikpediaへのリンクつき。検索が効いて思想家を探すこともできる。


    Graphviz自体には、思想家マップをつくるときにつかったGephiのような、結びつきの多寡に応じてノードの大きさを変えるような機能がない(やるならスクリプトの中で指示しなくてはならない)ので、あれほど見やすくは作れなかった。ネットワーク分析のソフトで解析した結果を使って、スクリプト自体を作るべきだろう。




    考える道具としてのdot言語 / Graphviz

     dot言語 / Graphvizをつかったダイアグラム作成は、Visioなどを使ったダイアグラム描きと、ネットワーク分析との、いわば中間に位置する。

     デザインの自由度やそのための操作性という点ではダイアグラム作成ソフトに劣る。
     またグラフの構造に関する指標に応じてノードを分類したり表示を変える機能に十分でなく、大量のデータを可視化することではネットワーク分析ソフトに比べて見劣りする。

     しかしダイヤグラム作成にかかる手間は最も少なく、ほとんど自動生成といっていいレベルにある。
     この特徴は、元になるデータに更新・修正がある場合に都合がよい。
     ソースコードを元にチャートをつくったり、動的データをダイヤグラムとして表示するケースなどがこれに当たる。

     今ここに自分のアタマから湧き出るアイデアもまた、更新・修正が繰り返されるデータの例に付け加えることができる。
     dot言語では、どの要素同士が結びつくかを列挙する形式(隣接リスト)で、グラフ構造を記述する。つまり要素の相互連関を分散的に記述でき、全体的にどうなるかを考える必要は無い。
     dot言語で書いたスクリプトをエディタで書き換えながら、Graphvizの上で更新されるチャートからフィードバックを得る。
     少数の要素を付け加えたり変更することで、グラフ構造の全体が(時に我々の直観を超えて)大きく変化することがあるが、どんなレイアウトにするかはコンピュータに丸投げできることで、可視化によるフィードバックを得ながら、要素を付け加えたり結びつけていくことができる。
     このとき、直観だけで扱うには複雑な構造について考えるための、すぐれた思考支援ツールを我々は使っていることになる。
     
     この「dot言語で書いたスクリプトをエディタで書き換え」というプロセスを、よりルック&フィールなインターフェイスに置き換えたものが、iPhone/iPadアプリの「Instaviz」である。


    Instaviz App

    カテゴリ: ビジネス

    価格: ¥850



     なにもないところに指先で丸を描けば丸い、四角を描けば四角のノードが生成される。
     ノードからノードへ指を滑らせれば、ノードの間にエッジで結ばれる。
     そして、それらのレイアウトは、ノード間の接続関係に基いて自動的に再配置される。
     下の動画にあるように、新たに要素を付け加えたり結びつけていくことで、リアルタイムでグラフ構造が組み替えられていく。
     もちろんdot言語をインポートでき、Graphvizのファイル形式(Graphviz GV)でエクスポートできる。




     
     Visioを使う人が伝えるべきことが伝わるようなレイアウトを工夫し、ネットワーク分析を行う研究者がデータの構造を掴み取ろうとして、それぞれ試行錯誤するように、dot言語/GraphvizあるいはInstavizに向かう者は、アイデアを生み出し結びつけ、自身の直観を超えた何かが組み上がることを目指して、試行錯誤する。

     それは〈発見的〉なものとでも言うべきものであり、つまりdot言語/GraphvizあるいはInstavizを使うのは、描こうとしているものが、どのようなものか分かっていない、むしろそれを知りたいという場合である。






    ※ Graphvizは、AT&T研究所が開発した、オープンソースのグラフ(ダイヤグラムや有向グラフ)描画ツール。
    dot言語で書かれたスクリプト(テキストファイル)からグラフをつくり、png、svgなどを生成するツール(出力できるフォーマットはこちら)。

      Graphviz本家のホームページのダウンロード http://www.graphviz.org/Download..php
        (Linux, Windows, Mac OS X用)


      日本語での解説は、
      Graphviz チュートリアル http://homepage3.nifty.com/kaku-chan/graphviz/
      dotを使ったグラフ描画 http://www.cbrc.jp/~tominaga/translations/graphviz/dotguide.pdf


    関連記事
    Secret

    TrackBackURL
    →https://readingmonkey.blog.fc2.com/tb.php/644-d8ab3a83