Skip to content

Instantly share code, notes, and snippets.

@cstow
Forked from mbostock/.block
Last active August 10, 2018 13:13
Show Gist options
  • Select an option

  • Save cstow/2a3972cc826035d3e7a156888f3d24e2 to your computer and use it in GitHub Desktop.

Select an option

Save cstow/2a3972cc826035d3e7a156888f3d24e2 to your computer and use it in GitHub Desktop.
Force-Directed Graph
license: gpl-3.0
height: 600

This simple force-directed graph shows character co-occurence in Les Misérables. A physical simulation of charged particles and springs places related characters in closer proximity, while unrelated characters are farther apart. Layout algorithm inspired by Tim Dwyer and Thomas Jakobsen. Data based on character coappearence in Victor Hugo's Les Misérables, compiled by Donald Knuth.

Compare this display to a force layout with curved links, a force layout with fisheye distortion and a matrix diagram.

<!DOCTYPE html>
<meta charset="utf-8">
<style>
.links line {
stroke: #999;
stroke-opacity: 0.6;
}
.nodes circle {
stroke: #fff;
stroke-width: 1.5px;
}
</style>
<svg width="960" height="600"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script>
var svg = d3.select("svg"),
width = +svg.attr("width"),
height = +svg.attr("height");
var color = d3.scaleOrdinal(d3.schemeCategory20);
var simulation = d3.forceSimulation()
.force("link", d3.forceLink().id(function(d) { return d.id; }))
.force("charge", d3.forceManyBody())
.force("center", d3.forceCenter(width / 2, height / 2));
d3.json("mdt.json", function(error, graph) {
if (error) throw error;
var link = svg.append("g")
.attr("class", "links")
.selectAll("line")
.data(graph.links)
.enter().append("line")
.attr("stroke-width", function(d) { return Math.sqrt(d.value); });
var node = svg.append("g")
.attr("class", "nodes")
.selectAll("circle")
.data(graph.nodes)
.enter().append("circle")
.attr("r", 5)
.attr("fill", function(d) { return color(d.group); })
.call(d3.drag()
.on("start", dragstarted)
.on("drag", dragged)
.on("end", dragended));
node.append("title")
.text(function(d) { return d.id; });
simulation
.nodes(graph.nodes)
.on("tick", ticked);
simulation.force("link")
.links(graph.links);
function ticked() {
link
.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
}
});
function dragstarted(d) {
if (!d3.event.active) simulation.alphaTarget(0.3).restart();
d.fx = d.x;
d.fy = d.y;
}
function dragged(d) {
d.fx = d3.event.x;
d.fy = d3.event.y;
}
function dragended(d) {
if (!d3.event.active) simulation.alphaTarget(0);
d.fx = null;
d.fy = null;
}
</script>
{
"nodes": [
{
"id": "thing",
"group": 1
},
{
"id": "data",
"group": 1
},
{
"id": "service",
"group": 1
},
{
"id": "coding",
"group": 1
},
{
"id": "portrayal",
"group": 1
},
{
"id": "software",
"group": 1
},
{
"id": "hardware",
"group": 1
},
{
"id": "location",
"group": 1
},
{
"id": "time",
"group": 1
},
{
"id": "relationship",
"group": 1
},
{
"id": "model",
"group": 2
},
{
"id": "metadata",
"group": 2
},
{
"id": "MGMP",
"group": 3
},
{
"id": "DocumentPart1",
"group": 3
},
{
"id": "XMLSchemaPart2",
"group": 3
},
{
"id": "UMLModelPart3",
"group": 3
},
{
"id": "SchematronPart4",
"group": 3
},
{
"id": "MappingsPart5",
"group": 3
},
{
"id": "VocabulariesPart6",
"group": 3
},
{
"id": "ISO",
"group": 4
},
{
"id": "19100Series",
"group": 4
},
{
"id": "19115",
"group": 4
},
{
"id": "19115_1",
"group": 4
},
{
"id": "19115_2",
"group": 4
},
{
"id": "19115_3",
"group": 4
},
{
"id": "19139",
"group": 4
},
{
"id": "19157",
"group": 4
},
{
"id": "DMF",
"group": 5
},
{
"id": "NMF",
"group": 6
},
{
"id": "NMFSampleStatistics",
"group": 6
},
{
"id": "NAS",
"group": 7
},
{
"id": "DGIF",
"group": 8
},
{
"id": "DGIM",
"group": 8
},
{
"id": "DGRWI",
"group": 8
},
{
"id": "DGFCD",
"group": 8
},
{
"id": "NGMP",
"group": 9
},
{
"id": "NCMS",
"group": 9
},
{
"id": "World",
"group": 10
},
{
"id": "Europe",
"group": 10
},
{
"id": "Americas",
"group": 10
},
{
"id": "GBR",
"group": 10
},
{
"id": "USA",
"group": 10
},
{
"id": "FRA",
"group": 10
},
{
"id": "BEL",
"group": 10
},
{
"id": "CHE",
"group": 10
},
{
"id": "coordinate",
"group": 10
},
{
"id": "Numeric",
"group": 17
},
{
"id": "DegreeMintuesSecond",
"group": 16
},
{
"id": "DecimalDegrees",
"group": 16
},
{
"id": "Latitude",
"group": 19
},
{
"id": "Longitude",
"group": 19
},
{
"id": "Altitude",
"group": 19
},
{
"id": "Year",
"group": 11
},
{
"id": "Month",
"group": 11
},
{
"id": "Day",
"group": 11
},
{
"id": "hour",
"group": 11
},
{
"id": "minute",
"group": 11
},
{
"id": "second",
"group": 11
},
{
"id": "Zone",
"group": 11
},
{
"id": "GMT",
"group": 12
},
{
"id": "CEST",
"group": 12
},
{
"id": "PST",
"group": 12
},
{
"id": "MST",
"group": 12
},
{
"id": "CST",
"group": 12
},
{
"id": "EST",
"group": 12
},
{
"id": "2003",
"group": 14
},
{
"id": "2006",
"group": 14
},
{
"id": "2009",
"group": 14
},
{
"id": "2013",
"group": 14
},
{
"id": "2014",
"group": 14
},
{
"id": "2017",
"group": 14
},
{
"id": "1.0",
"group": 13
},
{
"id": "2.0",
"group": 13
},
{
"id": "5.0",
"group": 13
},
{
"id": "6.0",
"group": 13
},
{
"id": "7.0",
"group": 13
},
{
"id": "8.0",
"group": 13
},
{
"id": "ownedBy",
"group": 15
},
{
"id": "operatesWith",
"group": 15
},
{
"id": "locatedAt",
"group": 15
},
{
"id": "hasDate",
"group": 15
},
{
"id": "versionIs",
"group": 15
},
{
"id": "has",
"group": 15
},
{
"id": "hasBeen",
"group": 15
},
{
"id": "isAt",
"group": 15
},
{
"id": "at",
"group": 15
},
{
"id": "on",
"group": 15
},
{
"id": "isSameAs",
"group": 15
},
{
"id": "disjoint",
"group": 18
},
{
"id": "touches",
"group": 18
},
{
"id": "overlaps",
"group": 18
},
{
"id": "equals",
"group": 18
},
{
"id": "within",
"group": 18
},
{
"id": "contains",
"group": 18
},
{
"id": "intersects",
"group": 18
}
],
"links": [
{
"source": "data",
"target": "thing",
"value": 1
},
{
"source": "service",
"target": "thing",
"value": 1
},
{
"source": "coding",
"target": "thing",
"value": 1
},
{
"source": "portrayal",
"target": "thing",
"value": 1
},
{
"source": "software",
"target": "thing",
"value": 1
},
{
"source": "hardware",
"target": "thing",
"value": 1
},
{
"source": "location",
"target": "thing",
"value": 1
},
{
"source": "time",
"target": "thing",
"value": 1
},
{
"source": "relationship",
"target": "thing",
"value": 1
},
{
"source": "data",
"target": "model",
"value": 3
},
{
"source": "data",
"target": "metadata",
"value": 2
},
{
"source": "metadata",
"target": "model",
"value": 3
},
{
"source": "model",
"target": "MGMP",
"value": 3
},
{
"source": "model",
"target": "ISO",
"value": 3
},
{
"source": "model",
"target": "DMF",
"value": 3
},
{
"source": "model",
"target": "NMF",
"value": 3
},
{
"source": "model",
"target": "NAS",
"value": 3
},
{
"source": "model",
"target": "DGIF",
"value": 3
},
{
"source": "model",
"target": "NGIF",
"value": 3
},
{
"source": "model",
"target": "portrayal",
"value": 2
},
{
"source": "model",
"target": "service",
"value": 2
},
{
"source": "model",
"target": "relationship",
"value": 3
},
{
"source": "MGMP",
"target": "metadata",
"value": 3
},
{
"source": "MGMP",
"target": "relationship",
"value": 3
},
{
"source": "MGMP",
"target": "versionIs",
"value": 4
},
{
"source": "versionIs",
"target": "nurmeric",
"value": 4
},
{
"source": "numeric",
"target": "1.0",
"value": 4
},
{
"source": "numeric",
"target": "2.0",
"value": 4
},
{
"source": "1.0",
"target": "operatesWith",
"value": 4
},
{
"source": "1.0",
"target": "relationship",
"value": 4
},
{
"source": "1.0",
"target": "DocumentPart1",
"value": 4
},
{
"source": "2.0",
"target": "1.0",
"value": 4
},
{
"source": "2.0",
"target": "relationship",
"value": 4
},
{
"source": "2.0",
"target": "DocumentPart1",
"value": 4
},
{
"source": "2.0",
"target": "XMLSchemaPart2",
"value": 4
},
{
"source": "2.0",
"target": "UMLModelPart3",
"value": 4
},
{
"source": "2.0",
"target": "SchematronPart4",
"value": 4
},
{
"source": "2.0",
"target": "MappingsPart5",
"value": 4
},
{
"source": "2.0",
"target": "VocabulariesPart6",
"value": 4
},
{
"source": "2.0",
"target": "operatesWith",
"value": 4
},
{
"source": "MGMP",
"target": "19115",
"value": 4
},
{
"source": "MGMP",
"target": "location",
"value": 4
},
{
"source": "MGMP",
"target": "time",
"value": 4
},
{
"source": "World",
"target": "location",
"value": 4
},
{
"source": "Europe",
"target": "World",
"value": 4
},
{
"source": "GBR",
"target": "Europe",
"value": 4
},
{
"source": "coordinates",
"target": "GBR",
"value": 4
},
{
"source": "DecimalDegrees",
"target": "coordinates",
"value": 4
},
{
"source": "Latitude",
"target": "DecimalDegrees",
"value": 4
},
{
"source": "Numeric",
"target": "Latitude",
"value": 4
},
{
"source": "51.510",
"target": "Numeric",
"value": 4
},
{
"source": "Longitude",
"target": "DecimalDegrees",
"value": 4
},
{
"source": "Numeric",
"target": "Longitude",
"value": 4
},
{
"source": "-0.120",
"target": "Numeric",
"value": 4
},
{
"source": "19115",
"target": "19139",
"value": 4
},
{
"source": "19115",
"target": "operatesWith",
"value": 4
},
{
"source": "19115",
"target": "relationship",
"value": 4
},
{
"source": "19115",
"target": "location",
"value": 4
},
{
"source": "19115",
"target": "time",
"value": 4
},
{
"source": "19115",
"target": "19100",
"value": 4
},
{
"source": "19100",
"target": "ISO",
"value": 4
},
{
"source": "ISO",
"target": "model",
"value": 4
},
{
"source": "19139",
"target": "19115",
"value": 4
},
{
"source": "19115",
"target": "19157",
"value": 4
},
{
"source": "World",
"target": "location",
"value": 4
},
{
"source": "Europe",
"target": "World",
"value": 4
},
{
"source": "CHE",
"target": "Europe",
"value": 4
},
{
"source": "19115",
"target": "versionIs",
"value": 4
},
{
"source": "Time",
"target": "versionIs",
"value": 4
},
{
"source": "Year",
"target": "Time",
"value": 4
},
{
"source": "DMF",
"target": "relationship",
"value": 4
},
{
"source": "DMF",
"target": "location",
"value": 4
},
{
"source": "DMF",
"target": "time",
"value": 4
},
{
"source": "World",
"target": "location",
"value": 4
},
{
"source": "Europe",
"target": "World",
"value": 4
},
{
"source": "FRA",
"target": "Europe",
"value": 4
},
{
"source": "verisonIs",
"target": "DMF",
"value": 4
},
{
"source": "numeric",
"target": "versionIs",
"value": 4
},
{
"source": "1.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "1.0",
"value": 4
},
{
"source": "year",
"target": "time",
"value": 4
},
{
"source": "2013",
"target": "year",
"value": 4
},
{
"source": "2.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "2.0",
"value": 4
},
{
"source": "year",
"target": "time",
"value": 4
},
{
"source": "2017",
"target": "year",
"value": 4
},
{
"source": "NAS",
"target": "model",
"value": 4
},
{
"source": "location",
"target": "NAS",
"value": 4
},
{
"source": "time",
"target": "NAS",
"value": 4
},
{
"source": "world",
"target": "location",
"value": 4
},
{
"source": "Americas",
"target": "world",
"value": 4
},
{
"source": "USA",
"target": "Americas",
"value": 4
},
{
"source": "relationship",
"target": "NAS",
"value": 4
},
{
"source": "ownedBy",
"target": "relationship",
"value": 4
},
{
"source": "versionIs",
"target": "relationship",
"value": 4
},
{
"source": "numeric",
"target": "verisonIs",
"value": 4
},
{
"source": "5.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "5.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2009",
"target": "Year",
"value": 4
},
{
"source": "6.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "6.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2013",
"target": "Year",
"value": 4
},
{
"source": "7.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "7.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2014",
"target": "Year",
"value": 4
},
{
"source": "8.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "8.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2017",
"target": "Year",
"value": 4
},
{
"source": "DGIF",
"target": "model",
"value": 4
},
{
"source": "NGIF",
"target": "DGIF",
"value": 4
},
{
"source": "location",
"target": "DGIF",
"value": 4
},
{
"source": "time",
"target": "DGIF",
"value": 4
},
{
"source": "world",
"target": "location",
"value": 4
},
{
"source": "Europe",
"target": "world",
"value": 4
},
{
"source": "GBR",
"target": "Europe",
"value": 4
},
{
"source": "relationship",
"target": "DGIF",
"value": 4
},
{
"source": "ownedBy",
"target": "relationship",
"value": 4
},
{
"source": "versionIs",
"target": "relationship",
"value": 4
},
{
"source": "numeric",
"target": "verisonIs",
"value": 4
},
{
"source": "1.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "1.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2013",
"target": "Year",
"value": 4
},
{
"source": "2.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "2.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2017",
"target": "Year",
"value": 4
},
{
"source": "NGIF",
"target": "model",
"value": 4
},
{
"source": "DGIF",
"target": "NGIF",
"value": 4
},
{
"source": "location",
"target": "NGIF",
"value": 4
},
{
"source": "time",
"target": "NGIF",
"value": 4
},
{
"source": "world",
"target": "location",
"value": 4
},
{
"source": "Europe",
"target": "world",
"value": 4
},
{
"source": "BEL",
"target": "Europe",
"value": 4
},
{
"source": "relationship",
"target": "NGIF",
"value": 4
},
{
"source": "ownedBy",
"target": "relationship",
"value": 4
},
{
"source": "versionIs",
"target": "relationship",
"value": 4
},
{
"source": "sameAs",
"target": "relationship",
"value": 4
},
{
"source": "DGIF",
"target": "sameAs",
"value": 4
},
{
"source": "numeric",
"target": "verisonIs",
"value": 4
},
{
"source": "1.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "1.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2013",
"target": "Year",
"value": 4
},
{
"source": "2.0",
"target": "numeric",
"value": 4
},
{
"source": "time",
"target": "2.0",
"value": 4
},
{
"source": "Year",
"target": "time",
"value": 4
},
{
"source": "2017",
"target": "Year",
"value": 4
},
{
"source": "hardware",
"target": "software",
"value": 1
},
{
"source": "hardware",
"target": "location",
"value": 1
},
{
"source": "software",
"target": "coding",
"value": 3
},
{
"source": "software",
"target": "data",
"value": 3
},
{
"source": "hardware",
"target": "location",
"value": 5
},
{
"source": "data",
"target": "relationship",
"value": 1
},
{
"source": "service",
"target": "relatiosnhip",
"value": 1
},
{
"source": "coding",
"target": "relationship",
"value": 1
},
{
"source": "portrayal",
"target": "relatiosnhip",
"value": 1
},
{
"source": "software",
"target": "relationship",
"value": 4
},
{
"source": "hardware",
"target": "relationship",
"value": 4
},
{
"source": "location",
"target": "relationship",
"value": 4
},
{
"source": "relationship",
"target": "ownedBy",
"value": 4
},
{
"source": "relationship",
"target": "locatedAt",
"value": 4
},
{
"source": "relationship",
"target": "operatesWith",
"value": 4
},
{
"source": "relationship",
"target": "hasDate",
"value": 4
},
{
"source": "relationship",
"target": "versionIS",
"value": 4
},
{
"source": "relationship",
"target": "has",
"value": 4
},
{
"source": "relationship",
"target": "hasBeen",
"value": 4
},
{
"source": "relationship",
"target": "operatesWith",
"value": 4
},
{
"source": "relationship",
"target": "disjoints",
"value": 4
},
{
"source": "relationship",
"target": "touches",
"value": 4
},
{
"source": "relationship",
"target": "overlaps",
"value": 4
},
{
"source": "relationship",
"target": "equals",
"value": 4
},
{
"source": "relationship",
"target": "within",
"value": 4
},
{
"source": "relationship",
"target": "contains",
"value": 4
},
{
"source": "relationship",
"target": "intersects",
"value": 4
},
{
"source": "service",
"target": "data",
"value": 3
},
{
"source": "service",
"target": "metadata",
"value": 4
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment