Skip to content

Instantly share code, notes, and snippets.

@ABSegler
Forked from mbostock/.block
Last active January 16, 2020 08:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save ABSegler/da91c5401ba0afc4d2ee to your computer and use it in GitHub Desktop.
Save ABSegler/da91c5401ba0afc4d2ee to your computer and use it in GitHub Desktop.
Interactive Piers Plowman A stemma

An interactive Reingold–Tilford tree displaying the genetic relationships between all Piers Plowman A manuscripts. Click on the nodes to expand or collapse.

This is an interactive display of the A MSS stemma as outlined in A.V.C. Schmidt's Parallel Text Edition of the poem (Vol. 2 pt 1.). For a static version displaying all nodes at once see Piers Plowman A MSS Stemma & Timeline. The main difference between this presentation and that which you find printed in Schmidt and elsewhere is that this diagram incorporates a temporal dimension to the outline of MS generation.

In addition to showing each generation of intermediate copies (represented by lowercase sigla), it also accounts for distinct periods of time and displays successive date ranges as empty nodes. The empty nodes are particularly important because they allow us to locate temporal distance between the earliest possible generation for a missing parent manuscript (represented by lowercase sigla) and the actual appearance of an extant manuscript in that family. If a node has no name or sigil attached to it, then it is simply a temporal placeholder for that MS family.

Read more about this at Material Piers.

{"name": "Ax-A archetype",
"children": [
{"name": "*r*",
"children": [
{"name": "r1",
"children": [
{"name": "d",
"children": [
{"name": "t",
"children": [
{"name": "th2",
"children": [
{"name": "(AC) TCC R.3.14 c. 1400"
},
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "(AC) HARLEY 6041 ca. 1425"
}
]
}
]
}
]
},
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "(AC) CHADERTON 1420"
}
]
}
]
}
]
},
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Douce 323 1475-1500"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "u",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Rawl. 137 mid-15th C"
}
]
}
]
}
]
},
{"name": "Uni Coll Ox 45 1400-1425"
}
]
}
]
}
]
}
]
}
]
},
{"name": "r2",
"children": [
{"name": "v",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Vernon c.1400"
},
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Harley 875 ca. 1425-1475"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "j",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Ingilby mid-15th C"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "l",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Lincoln's Inn 1400-1425"
}
]
}
]
}
]
}
]
},
{"name": "k",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "(AC) DIGBY 145 1531"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "w",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "(AC) OLIM. DUKE OF W'S MS 1400-1425"
},
{"name": "(AC) NLW 733B 1400-1425"
}
]
}
]
}
]
}
]
},
{"name": "(z)",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "(ZAC) A VISIO ENDING + C ADDED 1439-1450"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "*m*",
"children": [
{"name": "e",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "TCD 213 1450-1500"
},
{"name": " ",
"children": [
{"name": "Ashmole 1475-1500"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{"name": "m",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "Soc. of Antiquaries 687 ca. 1425"
}
]
},
{"name": "(BA) HARLEY 3954 1400-1425"
}
]
}
]
}
]
}
]
}
]
},
{"name": "y",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": " ",
"children": [
{"name": "OR (AC) DUKE'S MS from here? 1400-1425"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.node {
cursor: pointer;
}
.node circle {
fill: #fff;
stroke: steelblue;
stroke-width: 1.5px;
}
.node text {
font: 10px sans-serif;
}
.link {
fill: none;
stroke: #ccc;
stroke-width: 1.5px;
}
</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
var margin = {top: 20, right: 120, bottom: 20, left: 120},
width = 960 - margin.right - margin.left,
height = 800 - margin.top - margin.bottom;
var i = 0,
duration = 750,
root;
var tree = d3.layout.tree()
.size([height, width]);
var diagonal = d3.svg.diagonal()
.projection(function(d) { return [d.y, d.x]; });
var svg = d3.select("body").append("svg")
.attr("width", width + margin.right + margin.left)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
d3.json("Astemma.json", function(error, flare) {
root = flare;
root.x0 = height / 2;
root.y0 = 0;
function collapse(d) {
if (d.children) {
d._children = d.children;
d._children.forEach(collapse);
d.children = null;
}
}
root.children.forEach(collapse);
update(root);
});
d3.select(self.frameElement).style("height", "800px");
function update(source) {
// Compute the new tree layout.
var nodes = tree.nodes(root).reverse(),
links = tree.links(nodes);
// Normalize for fixed-depth.
nodes.forEach(function(d) { d.y = d.depth * 50; });
// Update the nodes…
var node = svg.selectAll("g.node")
.data(nodes, function(d) { return d.id || (d.id = ++i); });
// Enter any new nodes at the parent's previous position.
var nodeEnter = node.enter().append("g")
.attr("class", "node")
.attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
.on("click", click);
nodeEnter.append("circle")
.attr("r", 1e-6)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeEnter.append("text")
.attr("x", function(d) { return d.children || d._children ? -10 : 10; })
.attr("dy", ".35em")
.attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
.text(function(d) { return d.name; })
.style("fill-opacity", 1e-6);
// Transition nodes to their new position.
var nodeUpdate = node.transition()
.duration(duration)
.attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });
nodeUpdate.select("circle")
.attr("r", 4.5)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeUpdate.select("text")
.style("fill-opacity", 1);
// Transition exiting nodes to the parent's new position.
var nodeExit = node.exit().transition()
.duration(duration)
.attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })
.remove();
nodeExit.select("circle")
.attr("r", 1e-6);
nodeExit.select("text")
.style("fill-opacity", 1e-6);
// Update the links…
var link = svg.selectAll("path.link")
.data(links, function(d) { return d.target.id; });
// Enter any new links at the parent's previous position.
link.enter().insert("path", "g")
.attr("class", "link")
.attr("d", function(d) {
var o = {x: source.x0, y: source.y0};
return diagonal({source: o, target: o});
});
// Transition links to their new position.
link.transition()
.duration(duration)
.attr("d", diagonal);
// Transition exiting nodes to the parent's new position.
link.exit().transition()
.duration(duration)
.attr("d", function(d) {
var o = {x: source.x, y: source.y};
return diagonal({source: o, target: o});
})
.remove();
// Stash the old positions for transition.
nodes.forEach(function(d) {
d.x0 = d.x;
d.y0 = d.y;
});
}
// Toggle children on click.
function click(d) {
if (d.children) {
d._children = d.children;
d.children = null;
} else {
d.children = d._children;
d._children = null;
}
update(d);
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment