ネットワークをデータアートとして描く方法：配置、束ね、時間、流れの文献｜ノート

力学配置で描いたネットワークは、そのネットワークの唯一の形に見えるが、実際には多くの並べ方の一つである。

力学配置で描いたネットワークの絵は、そのネットワークの形そのものに見える。群は島のようにまとまり、島と島のあいだを数本の辺がつなぐ。見る側は、近くにあるものは似ていて、真ん中にあるものは中心的だと読みたくなる。

この wiki の引用ネットワークを作ったとき、同じ読み方に引き寄せられた。ところが、同じ文献と同じ共引用の組から、乱数のシードを変えるだけで、島の位置も向きも違う絵が出てくる。絵を見比べても、どれが本当の形なのかは決まらない。

文献の側では、この不安は前提として扱われている。 Gansner, Koren, North（2005）は、stress majorization による配置の利点として局所最小に陥りにくいことを挙げ、25 通りの乱数の初期化で結果を比べた（本文確認）。比較をこの形で組むこと自体が、配置の結果が初期配置に左右されうることを前提にしている。 Venturini, Jacomy, Jensen（2021）は、力学配置で近くに置かれたことが意味の近さを必ずしも表さないことを、関係的曖昧性（relational ambiguity）として論じている。 Krzywinski ら（2012）は、配置の側でこの問題を避ける hive plot を提案した。出版社の要旨は、ノードの属性で軸と座標を決めるので、力学配置と違って再現でき、比べられると述べる（要旨確認）。

力学配置の絵は、多くの並べ方の一つである。では、ほかの並べ方にはどんな系統があり、それぞれ何を固定して何を動かしているのか。

各文献には、どこまで読んで確かめたか（本文確認、要旨確認、書誌のみ）を添える。書誌しか確かめていない文献については、題名を超える内容を書かない。

力学配置は何を釣り合わせているか

力学配置は、ノードどうしに働く力を決め、力が釣り合う位置を探す。何を力とみなすかで、絵の形が変わる。

Eades（1984）の spring embedder は、頂点を輪に、辺をばねに見立てた（本文確認）。ばねの力は距離に比例せず、c1 · log(d / c2) という対数の強さで働く。 d はばねの長さ（2 頂点の距離）、c1 と c2 は定数である。

ForceAtlas2（Jacomy ら、2014）は、Gephi のために設計された連続的な配置法で、力を次の式で定める（本文確認）。

引力：F_a = d（式 1）。距離 d に比例する。
斥力：F_r = k_r (deg1 + 1)(deg2 + 1) / d（式 2）。2 ノードの次数に 1 を足した値の積に比例し、距離に反比例する。
LinLog 型の引力：F_a = log(1 + d)（式 3）。引力を距離の対数に置き換える選択肢である。
重力：F_g = k_g (deg + 1)（式 4）。strong gravity を選ぶと、これに距離 d を掛ける（式 5）。
辺の重み：F_a = w^δ · d（式 6）。辺の重み w を δ 乗して引力に掛ける。

式を並べると、次数がどこに入るかがわかる。 deg + 1 は斥力と重力の係数として現れ、次数の多いノードほど強く押しのけ合い、強い重力を受ける。一方で、本文には「質量（mass）」という語が出てこない。 ForceAtlas2 は次数を力の係数として使っており、質量を定義してはいない。

d3-force の公式ドキュメントは、質量をはっきり固定している。シミュレーションは velocity Verlet 法で、時間刻みを Δt = 1 とし、すべての粒子の質量を m = 1 とする。質量が 1 なので、力はそのまま加速度になる。 alpha は焼きなましの温度にあたる値で、alphaMin を下回るとシミュレーションが止まる。多体の斥力（forceManyBody）は、四分木と Barnes–Hut 近似（theta 0.9）で計算する。既定の乱数源は、固定シードの線形合同法である。

乱数を固定すれば、同じ絵を何度でも再現できる。ただし、それは一つの配置を再現できるということで、配置が一つに決まることとは別である。

Barnes–Hut 近似の原典は、Barnes と Hut（1986）の階層的な O(N log N) の力の計算法である。 D3 そのものの設計は Bostock, Ogievetsky, Heer（2011）にまとめられている。グラフ描画の古典としては、Fruchterman と Reingold（1991）の force-directed placement と、Kamada と Kawai（1989）の無向グラフの描画算法もある。 Noack（2009）は「モジュラリティによるクラスタリングは力学配置である」という命題を題名に掲げる。この段落の 5 件は書誌のみの確認である。

力ではなく属性で座標を決める

力学配置では、位置は力の釣り合いから決まる。 Krzywinski ら（2012）の hive plot は、位置を属性から決める。要旨によれば、ノードの属性で、置く軸と軸の上の座標を決める。同じデータからは同じ図が出るので、別のネットワークの図と並べて比べられる、というのが要旨の主張である（要旨確認）。

Krzywinski は 2009 年に、共著者と Circos を発表している。題名は Circos を「比較ゲノミクスのための情報美学（information aesthetic）」と呼ぶ。可視化の手法の論文が、題名で美学を名乗っている例である。要旨までは確かめたが、配置の方法の記述は確かめていないので、ここには書かない。

辺を束ねる

ノードの置き方を決めても、辺が多いと絵は線の塊になる。 Holten（2006）の hierarchical edge bundles は、階層を持つデータの隣接関係を描く方法である。束ねの強さ β という一つの値が、直線（生の接続）から束（階層の親どうしの暗黙の隣接）までを連続的に制御する（本文確認）。同じデータから、一本一本の接続を見せる絵と、群と群の関係を見せる絵のあいだを、β だけで行き来できる。

Holten と van Wijk（2009）の force-directed edge bundling は、要旨によれば、辺どうしを引き合うばねとみなして束ねる（要旨確認）。

一本の軸と時間に並べる

二次元のどこに置くかを決めずに、要素を一本の軸に並べる方法もある。 Wattenberg（2002）の arc diagram は、要旨によれば、文字列の中で同じ部分文字列が現れる組を弧で結び、反復の構造を見せる（要旨確認）。弧の高さに何を符号化しているかは、本文に到達できず確かめていない。

時間を軸にとると、量の推移を帯の太さで描く系統になる。 Havre ら（2002）の ThemeRiver は、要旨によれば、文書群のテーマの強さを、時間に沿って流れる川の帯の幅で表す（要旨確認）。 Byron と Wattenberg（2008）は、積み上げグラフ、ThemeRiver、Streamgraph が、それぞれ異なるエネルギー関数を最小化していることを示した（本文確認）。同じ論文は、層の色付けと並べ方も提案している。基線の形の違いは、見た目の好みではなく、最小化する量の違いとして説明できる。

時間の中でネットワークそのものが組み替わる様子を描く図もある。 Rosvall と Bergstrom（2010）は、大きなネットワークの変化を写す図として alluvial diagram を示した（本文確認）。

流れとして描く

ベクトル場を流線で描く図法は、ネットワークのための方法ではない。それでも、配置から場を作れば、ネットワークを流れの絵として描ける（この wiki での使い方は後述する）。

Jobard と Lefer（1997）は、任意の密度で流線を等間隔に置く方法を示した。流線の間隔を決める d_sep と、それより小さい d_test（0 < d_test < d_sep）の二つの距離で、密度を制御する。 Turk と Banks（1996）は、要旨によれば、流線の配置をエネルギーの最適化として解き、手描きのような図を得る（要旨確認）。

曲線を作る

点の位置が決まっても、点と点をどういう曲線で結ぶかで線の見え方が変わる。結ぶ曲線がたるみすぎたり、区間の中で輪を作ったりすると、関係のない場所に線が通り、読み違えの元になる。

Catmull–Rom 曲線は、制御点をすべて通る 3 次の補間曲線である。標準的な出典として Catmull と Rom（1974）を挙げる（書誌のみ）。 Yuksel, Schaefer, Keyser（2009）は、節点の列を t_{i+1} = |P_{i+1} − P_i|^α + t_i で決める族を扱う（式 (1)、本文確認）。 α = 0 が一様、α = 1/2 が求心的（centripetal）、α = 1 が弦長のパラメータ化である。同論文は、3 次の Catmull–Rom 曲線では求心的なパラメータ化だけが、区間の中にカスプも自己交差も作らないことを証明した（第 3 節の定理 1 から 3）。同論文の図 3 は、区間の値を線形補間の重ね合わせで求める Barry と Goldman の算法を、ピラミッドの形で図解している。その原典の Barry と Goldman（1988）は、標準的な出典として挙げる（書誌のみ）。同じ著者の論文誌版（Yuksel, Schaefer, Keyser, 2011）は、書誌と要旨まで確かめた。

一様な 3 次 B-spline の基底の式は、de Boor（1978）と Bartels, Beatty, Barsky（1987）を標準的な出典として挙げる（どちらも書誌のみ）。 Holten（2006）の hierarchical edge bundles は、階層の経路を制御点にした曲線で辺を描き、制御点を端点どうしの直線へ寄せる式 P’i = β P_i + (1 − β)(P_0 + i/(N − 1)(P{N−1} − P_0)) で束ねの強さを決める（3.2 節の式 (1)、本文確認）。

流線と流れの図は、曲線を数値計算で作る。流線を 1 歩ずつ積分する中点法（2 次の Runge–Kutta 法）は Press ら（1992）を、ガウス核による密度の推定は Silverman（1986）を、流れ関数 ψ から速度場 v = (∂ψ/∂y, −∂ψ/∂x) を作る方法は Batchelor（1967/2000）を、それぞれ標準的な出典として挙げる。いずれも書誌のみの確認で、Press らについては第 16.1 節が Runge–Kutta 法であることを目次で確かめた。流れ関数から作った速度場の発散は、偏微分の順序を入れ替えても値が変わらない（∂²ψ/∂x∂y = ∂²ψ/∂y∂x）ので 0 になる。湧き出しも吸い込みもない場なので、流線が一点に詰まらない。

データを作品として扱う先行例

データを使った作品の系譜は、本ノートでは所在と書誌を確かめた段階にとどまる。作品の内容や手法は、確かめたページを超えては書かない。

Viégas と Wattenberg（2007）は、芸術としてのデータ可視化を論じた（要旨確認）。その定義の読み方はデータビジュアライゼーションとデータアートは何が同じで、何が違うのかで扱った。 Kosara（2007）の題名は、可視化批評を、情報可視化とアートのあいだの「欠けた環（missing link）」と呼ぶ（書誌のみ）。 Lima（2011）の Visual Complexity: Mapping Patterns of Information は、“Networkism” という語の出典として挙げる。語の定義箇所までは確かめていない。

Lupi と Posavec（2016）の Dear Data は出版社のページで、Posavec の Writing Without Words は作家の公式ページで、Lombardi の Narrative Structures は Whitney Museum の作家ページで、それぞれ所在を確かめた。 Viégas と Wattenberg の Wind Map（2012）は、作者の公式ページ（hint.fm）で 2012 年の公開と作者を確かめた。MoMA の所蔵は、独立した資料どうしで一致している。

この wiki の /network での使い方

この wiki の引用ネットワーク：note をハイパーエッジとみなした分析と作品は、この wiki の公開 note の参照文献を、引用ネットワークとして分析した。 2 本以上の note に引かれた文献を結び目とし、同じ note に並ぶ結び目の組を共引用として結んでいる。 共引用は「2 つの文献が同じ第三の文献に引用される」関係で（Small, 1973）、書誌結合は「2 つの文献が同じ第三の文献を引用する」関係である（Kessler, 1963）。

引用ネットワークの作品は、この関係を固定したまま、並べ方だけを替えて描いている。どの結び目がどの結び目と共引用でつながるかは、どの作品でも変わらない。変わるのは、それを平面のどこに、どの軸に沿って置くかである。

力学配置の作品（織物、星座、流線）では、結び目の位置を、ForceAtlas2 の式の形を借りた力の計算で、閲覧のたびにブラウザの中で決めている。結び目の質量をその文献を引く note の数とし、力を質量で割った値を加速度として動かした。押し合う強さ（電荷）は質量の平方根とし、中心への引力には質量を掛けていない。これは ForceAtlas2 からも d3-force の既定からも取っていない、この wiki の設計である。 ForceAtlas2 は質量を定義せず、d3-force は質量を 1 に固定するからである。この設計で言えるのは、同じ力を受けたときの加速度が、引く note の多い文献ほど小さいことまでである。実測では、多く引かれた文献ほど共引用のばねの重みの合計も質量にほぼ比例して大きく、1 tick あたりの移動量は小さくならなかった（数値はこの wiki の引用ネットワーク：note をハイパーエッジとみなした分析と作品の「作品の式」にある）。シードは閲覧のたびに変わって URL に残り、同じシードからは同じ絵が出る。シードを変えれば島の位置と向きは変わるが、共引用の組は変わらない。

ほかの作品は、それぞれ別の文献から並べ方を借りている。

織物：1 本の note を、力学配置で決まった結び目を近い順に通る 1 本の糸にし、制御点を通る中心化 Catmull–Rom 曲線で描く。
年輪：関心の時期で半径の帯を、群で角度の扇形を決める。hive plot と同じく、属性から座標の枠を決める置き方である。帯と扇形が交わる区画の中の位置だけを、区画の中心への強い引力と、同じ区画の中の押し合いと、区画をまたぐ弱いばねで決める。
弧：note を書いた日の順に一本の基線に等間隔に並べ、同じ文献を引く note どうし（書誌結合）を半円の弧で結ぶ。arc diagram の形を借りているが、繰り返されるのは部分文字列ではなく、引いた文献である。弧は真の半円にしたので、弧の高さは書いた順の隔たり（あいだに書かれた note の多さ）として読める。
束：結び目を円周に並べ、共引用を Holten（2006）の方法で束ねる。階層は根、群、時期、結び目の順に置き、β は 0.85 とした。寄せた制御点は、端点を 3 重にした一様な 3 次 B-spline で結ぶ。
流れ：群ごとに、note が結び目を通る回数を、note を書いた日に沿ってガウス核で広げて積み上げた streamgraph である。基線は層の傾きを太さで重みづけて小さくする形にし、立ち上がりの早い群を中央に、遅い群を外側に足した。どちらも Byron と Wattenberg（2008）が論じた基線と層の並べ方から選んでいる。層の境界は中心化 Catmull–Rom 曲線でなめらかにした。
流線：閲覧ごとに力の計算で生んだ結び目の位置から、結び目ごとの渦と左から右へのゆるい流れを重ねた場を作り、その流線を Jobard と Lefer（1997）の方法で等間隔に置いた。d_test は d_sep の半分とし、流線は中点法で積分した。

冒頭で見た島の形は、シードと力の設計が決めた一つの並べ方だった。弧、束、流れ、流線は、同じ共引用の組を、時間や階層や場という別の軸で並べ直している。どの並べ方がこの wiki の関心の動きを最もよく写すのかは、絵を並べて見比べるだけでは決まらない。

まだ確認していないこと

Fruchterman と Reingold（1991）、Kamada と Kawai（1989）、Barnes と Hut（1986）、Bostock ら（2011）、Noack（2009）は書誌のみの確認で、本文の内容を本ノートの根拠に使っていない。
Wattenberg（2002）の弧の高さの符号化と、Kosara（2007）の本文には到達していない。
Catmull と Rom（1974）、Barry と Goldman（1988）、de Boor（1978）、Bartels ら（1987）、Press ら（1992）、Silverman（1986）、Batchelor（1967/2000）は書誌のみの確認で、標準的な式の出典として挙げるにとどめる。Yuksel ら（2011）は要旨まで確かめた。
Circos（Krzywinski ら、2009）と Viégas と Wattenberg（2007）は要旨まで確かめたが、本ノートでは題名を超える内容を書いていない。
先行例の作品（Dear Data、Writing Without Words、Narrative Structures、Wind Map）は所在の確認にとどまり、作品の手法とネットワーク図法との関係は調べていない。

参照文献

Barnes, J., & Hut, P. (1986). “A hierarchical O(N log N) force-calculation algorithm”. Nature, 324(6096), 446-449. https://doi.org/10.1038/324446a0
Barry, P. J., & Goldman, R. N. (1988). “A recursive evaluation algorithm for a class of Catmull-Rom splines”. In Proceedings of the 15th Annual Conference on Computer Graphics and Interactive Techniques (SIGGRAPH ‘88), 199-204. ACM. https://doi.org/10.1145/54852.378511
Bartels, R. H., Beatty, J. C., & Barsky, B. A. (1987). An Introduction to Splines for Use in Computer Graphics and Geometric Modeling. Morgan Kaufmann. ISBN 0-934613-27-3.
Batchelor, G. K. (2000). An Introduction to Fluid Dynamics. Cambridge University Press（初版 1967）. https://doi.org/10.1017/CBO9780511800955
Bostock, M., Ogievetsky, V., & Heer, J. (2011). “D3: Data-Driven Documents”. IEEE Transactions on Visualization and Computer Graphics, 17(12), 2301-2309. https://doi.org/10.1109/TVCG.2011.185
Byron, L., & Wattenberg, M. (2008). “Stacked Graphs: Geometry & Aesthetics”. IEEE Transactions on Visualization and Computer Graphics, 14(6). https://doi.org/10.1109/TVCG.2008.166
Catmull, E., & Rom, R. (1974). “A class of local interpolating splines”. In R. E. Barnhill & R. F. Riesenfeld (Eds.), Computer Aided Geometric Design, 317-326. Academic Press. https://doi.org/10.1016/B978-0-12-079050-0.50020-5
D3. (n.d.). “d3-force”. D3 documentation. https://d3js.org/d3-force （2026-09-23 アクセス）
de Boor, C. (1978). A Practical Guide to Splines. Springer. ISBN 978-0-387-90356-9.
Eades, P. (1984). “A heuristic for graph drawing”. Congressus Numerantium, 42, 149-160. https://www.cs.ubc.ca/~will/536E/papers/Eades1984.pdf
Fruchterman, T. M. J., & Reingold, E. M. (1991). “Graph drawing by force-directed placement”. Software: Practice and Experience, 21(11), 1129-1164. https://doi.org/10.1002/spe.4380211102
Gansner, E. R., Koren, Y., & North, S. (2005). “Graph Drawing by Stress Majorization”. In Graph Drawing 2004, LNCS 3383, 239-250. https://doi.org/10.1007/978-3-540-31843-9_25
Havre, S., Hetzler, E., Whitney, P., & Nowell, L. (2002). “ThemeRiver: Visualizing thematic changes in large document collections”. IEEE Transactions on Visualization and Computer Graphics, 8(1). https://doi.org/10.1109/2945.981848
Holten, D. (2006). “Hierarchical Edge Bundles: Visualization of Adjacency Relations in Hierarchical Data”. IEEE Transactions on Visualization and Computer Graphics, 12(5), 741-748. https://doi.org/10.1109/TVCG.2006.147
Holten, D., & van Wijk, J. J. (2009). “Force-Directed Edge Bundling for Graph Visualization”. Computer Graphics Forum, 28(3), 983-990. https://doi.org/10.1111/j.1467-8659.2009.01450.x
Jacomy, M., Venturini, T., Heymann, S., & Bastian, M. (2014). “ForceAtlas2, a Continuous Graph Layout Algorithm for Handy Network Visualization Designed for the Gephi Software”. PLoS ONE, 9(6), e98679. https://doi.org/10.1371/journal.pone.0098679
Jobard, B., & Lefer, W. (1997). “Creating Evenly-Spaced Streamlines of Arbitrary Density”. In Visualization in Scientific Computing ‘97. Springer. https://doi.org/10.1007/978-3-7091-6876-9_5
Kamada, T., & Kawai, S. (1989). “An algorithm for drawing general undirected graphs”. Information Processing Letters, 31(1), 7-15. https://doi.org/10.1016/0020-0190(89)90102-6
Kessler, M. M. (1963). “Bibliographic coupling between scientific papers”. American Documentation, 14(1), 10-25. https://doi.org/10.1002/asi.5090140103
Kosara, R. (2007). “Visualization Criticism: The Missing Link Between Information Visualization and Art”. Proc. IV 2007, 631-636. IEEE. https://doi.org/10.1109/IV.2007.130
Krzywinski, M., Birol, I., Jones, S. J. M., & Marra, M. A. (2012). “Hive plots: Rational approach to visualizing networks”. Briefings in Bioinformatics, 13(5), 627-644. https://doi.org/10.1093/bib/bbr069
Krzywinski, M., et al. (2009). “Circos: An information aesthetic for comparative genomics”. Genome Research, 19(9), 1639-1645. https://doi.org/10.1101/gr.092759.109
Lima, M. (2011). Visual Complexity: Mapping Patterns of Information. Princeton Architectural Press. ISBN 978-1-56898-936-5.
Lombardi, M. (n.d.). Narrative Structures. Whitney Museum of American Art（作家ページ）. https://whitney.org/artists/7340
Lupi, G., & Posavec, S. (2016). Dear Data. Princeton Architectural Press. ISBN 978-1-61689-532-7.
Noack, A. (2009). “Modularity clustering is force-directed layout”. Physical Review E, 79, 026102. https://doi.org/10.1103/PhysRevE.79.026102
Posavec, S. (n.d.). Writing Without Words. https://www.stefanieposavec.com/archive/writing-without-words
Press, W. H., Teukolsky, S. A., Vetterling, W. T., & Flannery, B. P. (1992). Numerical Recipes in C (2nd ed.). Cambridge University Press. ISBN 0-521-43108-5.
Rosvall, M., & Bergstrom, C. T. (2010). “Mapping change in large networks”. PLoS ONE, 5(1), e8694. https://doi.org/10.1371/journal.pone.0008694
Silverman, B. W. (1986). Density Estimation for Statistics and Data Analysis. Chapman & Hall. ISBN 0-412-24620-1.
Small, H. (1973). “Co-citation in the scientific literature: A new measure of the relationship between two documents”. Journal of the American Society for Information Science, 24(4), 265-269. https://doi.org/10.1002/asi.4630240406
Turk, G., & Banks, D. (1996). “Image-guided streamline placement”. SIGGRAPH ‘96. https://doi.org/10.1145/237170.237285
Venturini, T., Jacomy, M., & Jensen, P. (2021). “What do we see when we look at networks: Visual network analysis, relational ambiguity, and force-directed layouts”. Big Data & Society, 8(1). https://doi.org/10.1177/20539517211018488
Viégas, F. B., & Wattenberg, M. (2007). “Artistic Data Visualization: Beyond Visual Analytics”. In Online Communities and Social Computing (HCI International 2007), LNCS. https://doi.org/10.1007/978-3-540-73257-0_21
Viégas, F., & Wattenberg, M. (2012). Wind Map. http://hint.fm/wind/
Wattenberg, M. (2002). “Arc Diagrams: Visualizing Structure in Strings”. IEEE InfoVis 2002. https://doi.org/10.1109/INFVIS.2002.1173155
Yuksel, C., Schaefer, S., & Keyser, J. (2009). “On the parameterization of Catmull-Rom curves”. In 2009 SIAM/ACM Joint Conference on Geometric and Physical Modeling, 47-53. ACM. https://doi.org/10.1145/1629255.1629262
Yuksel, C., Schaefer, S., & Keyser, J. (2011). “Parameterization and applications of Catmull–Rom curves”. Computer-Aided Design, 43(7), 747-755. https://doi.org/10.1016/j.cad.2010.08.008

ネットワークをデータアートとして描く方法：配置、束ね、時間、流れの文献