Drawing Networks as Data Art: Literature on Placement, Bundling, Time, and Flow

A force-directed drawing of a network looks like the one true shape of that network, but it is only one of many arrangements.

A force-directed drawing of a network looks like the shape of the network itself. Groups gather into islands, and a few edges bridge one island to the next. Viewers want to read nearby things as similar and central things as important.

Building this wiki’s Citation Network, we were drawn into the same reading. Yet from the same references and the same co-citation pairs, changing only the random seed produces a picture with islands in different places and facing different directions. Comparing the pictures does not settle which one is the true shape.

The literature treats this unease as a premise. Gansner, Koren, and North (2005) name robustness against local minima as an advantage of layout by stress majorization, and compare results over 25 random initializations (verified in full text). Framing the comparison this way already assumes that the outcome of a layout can depend on its initial placement. Venturini, Jacomy, and Jensen (2021) discuss, as relational ambiguity, the point that nodes placed close together by a force-directed layout are not necessarily close in meaning. Krzywinski et al. (2012) proposed hive plots, which avoid the problem on the placement side. The publisher’s abstract states that because axes and coordinates are set by node attributes, hive plots, unlike force-directed layouts, are reproducible and comparable (verified at abstract level).

A force-directed picture is one arrangement among many. What other families of arrangement are there, and what does each hold fixed and what does it let move?

Each source below is tagged with how far it was read (full text, abstract, or bibliographic only). For sources verified only bibliographically, nothing beyond the title is described.

What force-directed placement balances

Force-directed placement defines forces between nodes and searches for positions where the forces balance. What counts as a force changes the shape of the picture.

Eades’s (1984) spring embedder treats vertices as rings and edges as springs (verified in full text). The spring force is not proportional to distance; it acts with logarithmic strength, c1 · log(d / c2). Here d is the length of the spring (the distance between two vertices), and c1 and c2 are constants.

ForceAtlas2 (Jacomy et al., 2014) is a continuous layout algorithm designed for Gephi, and it defines its forces with the following equations (verified in full text).

Attraction: F_a = d (Eq. 1). Proportional to distance d.
Repulsion: F_r = k_r (deg1 + 1)(deg2 + 1) / d (Eq. 2). Proportional to the product of each node’s degree plus one, and inversely proportional to distance.
LinLog attraction: F_a = log(1 + d) (Eq. 3). An option that replaces attraction with the logarithm of distance.
Gravity: F_g = k_g (deg + 1) (Eq. 4). With strong gravity, this is multiplied by distance d (Eq. 5).
Edge weight: F_a = w^δ · d (Eq. 6). The edge weight w, raised to the power δ, multiplies the attraction.

Laid side by side, the equations show where degree enters. deg + 1 appears as a coefficient of repulsion and of gravity, so higher-degree nodes push each other away harder and feel stronger gravity. The word “mass”, however, does not appear in the paper. ForceAtlas2 uses degree as a coefficient on forces; it does not define mass.

The official d3-force documentation fixes mass explicitly. The simulation uses velocity Verlet integration with a time step of Δt = 1, and every particle has mass m = 1. Since the mass is 1, force equals acceleration. alpha corresponds to the temperature in simulated annealing, and the simulation stops once alpha falls below alphaMin. The many-body repulsion (forceManyBody) is computed with a quadtree and the Barnes–Hut approximation (theta 0.9). The default random source is a linear congruential generator with a fixed seed.

Fixing the random numbers lets the same picture be reproduced any number of times. But reproducing one arrangement is not the same as the arrangement being uniquely determined.

The Barnes–Hut approximation originates in Barnes and Hut’s (1986) hierarchical O(N log N) force-calculation algorithm. The design of D3 itself is described by Bostock, Ogievetsky, and Heer (2011). Classics of graph drawing also include Fruchterman and Reingold’s (1991) force-directed placement and Kamada and Kawai’s (1989) algorithm for drawing general undirected graphs. Noack (2009) states in its title the proposition that modularity clustering is force-directed layout. The five sources in this paragraph were verified bibliographically only.

Setting coordinates from attributes instead of forces

In force-directed placement, positions follow from the balance of forces. Krzywinski et al.’s (2012) hive plots set positions from attributes. According to the abstract, node attributes determine which axis a node goes on and where it sits along that axis. The abstract’s claim is that the same data yields the same figure, so figures of different networks can be placed side by side and compared (verified at abstract level).

In 2009, Krzywinski and co-authors published Circos. Its title calls Circos “an information aesthetic for comparative genomics”. It is an example of a visualization methods paper naming aesthetics in its title. The abstract was checked, but its description of the layout method was not, so it is not described here.

Bundling edges

Even once node positions are set, many edges turn the picture into a mass of lines. Holten’s (2006) hierarchical edge bundles is a method for visualizing adjacency relations in hierarchical data. A single bundling strength, β, controls the drawing continuously from straight lines (the raw connections) to bundles (the implicit adjacency between parents in the hierarchy) (verified in full text). From the same data, β alone moves the picture between one that shows individual connections and one that shows relations between groups.

According to the abstract, Holten and van Wijk’s (2009) force-directed edge bundling bundles edges by treating them as springs that attract one another (verified at abstract level).

Arranging along a single axis and along time

Another approach skips choosing positions in two dimensions and lines elements up along a single axis. According to the abstract, Wattenberg’s (2002) arc diagram connects pairs of identical substrings in a string with arcs, showing the structure of repetition (verified at abstract level). What the arc height encodes was not checked, because the full text was not reached.

Taking time as the axis leads to a family that draws changing quantities as the thickness of bands. According to the abstract, Havre et al.’s (2002) ThemeRiver represents the strength of themes in a document collection as the width of bands in a river flowing along time (verified at abstract level). Byron and Wattenberg (2008) showed that stacked graphs, ThemeRiver, and Streamgraph each minimize a different energy function (verified in full text). The same paper also proposes how to color and order the layers. Differences in the shape of the baseline can therefore be explained as differences in the quantity being minimized, not as matters of taste.

Some figures show the network itself reorganizing over time. Rosvall and Bergstrom (2010) presented the alluvial diagram as a figure for mapping change in large networks (verified in full text).

Drawing as flow

Drawing a vector field with streamlines is not a network method. Still, if a field is built from a layout, a network can be drawn as a picture of flow (how this wiki does so is described below).

Jobard and Lefer (1997) presented a method for placing evenly spaced streamlines at arbitrary density. Density is controlled by two distances: d_sep, which sets the spacing between streamlines, and a smaller d_test (0 < d_test < d_sep). According to the abstract, Turk and Banks (1996) solve streamline placement as energy optimization and obtain figures that resemble hand-drawn ones (verified at abstract level).

Building the curves

Once the points are placed, how a curve joins them still changes how the lines read. A curve that overshoots, or loops within a span, runs through places unrelated to the relation it draws and invites misreading.

A Catmull–Rom curve is a cubic interpolating curve that passes through every control point. Catmull and Rom (1974) is given as the standard source (bibliographic only). Yuksel, Schaefer, and Keyser (2009) treat the family whose knot sequence is t_{i+1} = |P_{i+1} − P_i|^α + t_i (equation (1), verified in full text). α = 0 is the uniform, α = 1/2 the centripetal, and α = 1 the chordal parameterization. They prove that for cubic Catmull–Rom curves only the centripetal parameterization produces no cusps and no self-intersections within a span (Section 3, Theorems 1 to 3). Their Figure 3 illustrates, as a pyramid, the algorithm of Barry and Goldman that evaluates a span by stacking linear interpolations. The original, Barry and Goldman (1988), is given as the standard source (bibliographic only). The journal version by the same authors (Yuksel, Schaefer, and Keyser, 2011) was checked up to the bibliographic record and abstract.

For the basis of the uniform cubic B-spline, de Boor (1978) and Bartels, Beatty, and Barsky (1987) are given as the standard sources (both bibliographic only). Holten’s (2006) hierarchical edge bundles draw an edge as a curve whose control points are the path in the hierarchy, and set the bundling strength by pulling the control points toward the straight line between the end points: P’i = β P_i + (1 − β)(P_0 + i/(N − 1)(P{N−1} − P_0)) (Section 3.2, equation (1), verified in full text).

Streamlines and river figures build their curves numerically. For the midpoint method (second-order Runge–Kutta) that integrates a streamline step by step, Press et al. (1992); for density estimation with a Gaussian kernel, Silverman (1986); and for building a velocity field v = (∂ψ/∂y, −∂ψ/∂x) from a stream function ψ, Batchelor (1967/2000) are given as the standard sources. All three were checked bibliographically only; for Press et al., the table of contents confirms that Section 16.1 covers Runge–Kutta methods. A velocity field built from a stream function has zero divergence, because the order of partial derivatives does not matter (∂²ψ/∂x∂y = ∂²ψ/∂y∂x). With no sources and no sinks, streamlines do not jam into a single point.

Prior works that treat data as art

For the lineage of works made with data, this note has only confirmed where the works are and their bibliographic details. Nothing is described about their content or methods beyond the pages that were checked.

Viégas and Wattenberg (2007) discussed artistic data visualization (verified at abstract level). How to read their definition is covered in What Data Visualization and Data Art Share, and Where They Differ. Kosara’s (2007) title calls visualization criticism “the missing link” between information visualization and art (bibliographic only). Lima’s (2011) Visual Complexity: Mapping Patterns of Information is cited here as the source of the term “Networkism”. The passage where the term is defined was not checked.

The existence of Lupi and Posavec’s (2016) Dear Data was confirmed on the publisher’s page, Posavec’s Writing Without Words on the artist’s official page, and Lombardi’s Narrative Structures on the Whitney Museum’s artist page. For Viégas and Wattenberg’s Wind Map (2012), the 2012 launch and the authors were confirmed on the artists’ official page (hint.fm). Independent sources agree that MoMA holds it.

How this wiki’s /network page uses them

The Citation Network of This Wiki: Analysis and Artworks Treating Each Note as a Hyperedge analyzed the references of this wiki’s public notes as a citation network. References cited by two or more notes are knots, and pairs of knots listed in the same note are linked as co-citations. Co-citation is the relation in which two documents are cited by the same third document (Small, 1973); bibliographic coupling is the relation in which two documents cite the same third document (Kessler, 1963).

The works on the Citation Network page hold these relations fixed and change only the arrangement. Which knot is linked to which by co-citation is the same in every work. What changes is where on the plane, and along which axis, those relations are placed.

In the force-directed works (the weave, the constellation, and the streamlines), knot positions are computed in the browser on every view by forces whose forms are borrowed from ForceAtlas2. Each knot’s mass was set to the number of notes that cite that reference, and acceleration was taken as force divided by mass. How hard a knot pushes (its charge) is the square root of its mass, and the pull to the center carries no mass. This is this wiki’s own design, taken neither from ForceAtlas2 nor from the d3-force defaults. ForceAtlas2 does not define mass, and d3-force fixes mass at 1. What the design supports is only that the same force accelerates a reference cited by more notes less. In measurements, a reference cited by more notes also has co-citation springs whose total weight grows roughly in proportion to its mass, and its distance moved per tick was not smaller (the numbers are in “Formulas of the works” in The Citation Network of This Wiki: Analysis and Artworks Treating Each Note as a Hyperedge). The seed changes on every view and is kept in the URL, and the same seed yields the same picture. Changing the seed moves and rotates the islands, but the co-citation pairs do not change.

The other works each borrow their arrangement from different literature.

Weave: Each note becomes one thread that runs through the force-placed knots nearest first, drawn as a centripetal Catmull–Rom curve through its control points.
Rings: The period of interest sets a band of radii, and the group sets an angular sector. Like a hive plot, this sets the frame of the coordinates from attributes. Only the position inside the cell where band and sector meet is decided by forces: a strong pull to the cell center, pushing within the cell, and weak springs across cells.
Arcs: Notes are placed along a single baseline in the order they were written, and notes that cite the same reference (bibliographic coupling) are joined by semicircular arcs. The form is borrowed from the arc diagram, but what repeats is not a substring but a cited reference. Because the arcs are true semicircles, arc height reads as the distance in writing order (how many notes were written in between).
Bundle: Knots are placed on a circle, and co-citations are bundled with Holten’s (2006) method. The hierarchy runs root, group, period, knot, and β is set to 0.85. The straightened control points are joined by a uniform cubic B-spline with tripled end points.
River: A streamgraph that stacks, per group, the number of times notes pass through knots, spread with a Gaussian kernel along the dates the notes were written. The baseline minimizes the slope of the layers weighted by their thickness, and groups that start early sit in the middle while later ones are added on the outside. Both are chosen from the baselines and layer orderings discussed by Byron and Wattenberg (2008). The layer boundaries are smoothed with centripetal Catmull–Rom curves.
Streamlines: From the knot positions generated by the forces on each view, a field is built by superimposing a vortex for each knot on a gentle left-to-right flow, and its streamlines are placed evenly with Jobard and Lefer’s (1997) method. d_test is set to half of d_sep, and streamlines are integrated with the midpoint method.

The island shape seen at the start was one arrangement, decided by the seed and the design of the forces. Arcs, bundles, river, and streamlines rearrange the same co-citation pairs along other axes: time, hierarchy, and field. Which arrangement best reflects how this wiki’s interests move cannot be decided by laying the pictures side by side.

What remains unchecked

Fruchterman and Reingold (1991), Kamada and Kawai (1989), Barnes and Hut (1986), Bostock et al. (2011), and Noack (2009) were verified bibliographically only, and their content is not used as evidence in this note.
The arc-height encoding in Wattenberg (2002) and the full text of Kosara (2007) were not reached.
Catmull and Rom (1974), Barry and Goldman (1988), de Boor (1978), Bartels et al. (1987), Press et al. (1992), Silverman (1986), and Batchelor (1967/2000) were checked bibliographically only and are cited only as the standard sources for their formulas. Yuksel et al. (2011) was checked up to the abstract.
Circos (Krzywinski et al., 2009) and Viégas and Wattenberg (2007) were checked up to the abstract, but this note describes nothing beyond their titles.
For the prior works (Dear Data, Writing Without Words, Narrative Structures, Wind Map), only their existence was confirmed; their methods and their relation to network drawing were not examined.

References

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 (original work published 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 (accessed 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 (artist page). 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

The Citation Network of This Wiki: the citation network analysis drawn with the literature in this note. Knots, co-citation, groups, and periods are defined there.
What Data Visualization and Data Art Share, and Where They Differ: covers the distinction between visualization and data art that the prior-works section of this note assumes.