Skip to content

Instantly share code, notes, and snippets.

@eglassman

eglassman/.block

Last active October 18, 2017 01:00
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save eglassman/faaef6ac108a66bd67434850d3f463ba to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save eglassman/faaef6ac108a66bd67434850d3f463ba to your computer and use it in GitHub Desktop.
Download ZIP
Publications Narrative Chart
Raw
.block
license: mit
Raw
chart.js
// Request the data
d3.json('LotR.json', function(err, response){
console.log(response)
var svg, scenes, charactersMap, width, height, sceneWidth;
// Get the data in the format we need to feed to d3.layout.narrative().scenes
scenes = wrangle(response);
// Some defaults
sceneWidth = 13;
width = scenes.length * sceneWidth *5;
height = 1000;
labelSize = [190,20];
// The container element (this is the HTML fragment);
svg = d3.select("body").append('svg')
.attr('id', 'narrative-chart')
.attr('width', width)
.attr('height', height);
// Calculate the actual width of every character label.
scenes.forEach(function(scene){
scene.characters.forEach(function(character) {
character.width = svg.append('text')
.attr('opacity',0)
.attr('class', 'temp')
.text(character.name)
.node().getComputedTextLength()+10;
});
});
// Remove all the temporary labels.
svg.selectAll('text.temp').remove();
// Do the layout
narrative = d3.layout.narrative()
.scenes(scenes)
.size([width,height])
.pathSpace(21)
.groupMargin(2.4)
.labelSize([72,20])
.scenePadding([1.3824,sceneWidth/0.5,2,sceneWidth/2])
.labelPosition('left')
.layout();
// Get the extent so we can re-size the SVG appropriately.
svg.attr('height', narrative.extent()[1]);
// Draw the scenes
svg.selectAll('.scene').data(narrative.scenes()).enter()
.append('g').attr('class', 'scene')
.attr('transform', function(d){
var x,y;
x = Math.round(d.x)+0.5;
y = Math.round(d.y)+0.5;
return 'translate('+[x,y]+')';
})
.append('rect')
.attr('width', sceneWidth)
.attr('height', function(d){
return d.height;
})
.attr('y', 0)
.attr('x', 0)
.attr('rx', 3)
.attr('ry', 3);
// Draw appearances
svg.selectAll('.scene').selectAll('.appearance').data(function(d){
return d.appearances;
}).enter().append('circle')
.attr('cx', function(d){
return d.x;
})
.attr('cy', function(d){
return d.y;
})
.attr('r', function(){
return 2;
})
.attr('class', function(d){
return 'appearance ' + d.character.affiliation;
});
// Draw links
svg.selectAll('.link').data(narrative.links()).enter()
.append('path')
.attr('class', function(d) {
return 'link ' + d.character.affiliation.toLowerCase() + " " + d.character.id.toLowerCase();
})
.attr('d', narrative.link());
// Draw intro nodes
svg.selectAll('.intro').data(narrative.introductions())
.enter().call(function(s){
var g, text;
g = s.append('g').attr('class', 'intro');
g.append('rect')
.attr('y', -4)
.attr('x', -4)
.attr('width', 4)
.attr('height', 6);
text = g.append('g').attr('class','text');
// Apppend two actual 'text' nodes to fake an 'outside' outline.
text.append('text');
text.append('text').attr('class', 'color');
g.attr('transform', function(d){
var x,y;
x = Math.round(d.x);
y = Math.round(d.y);
return 'translate(' + [x,y] + ')';
});
g.selectAll('text')
.attr('text-anchor', 'end')
.attr('y', '4px')
.attr('x', '-8px')
.text(function(d){ return d.character.name; });
g.select('.color')
.attr('class', function(d){
return 'color ' + d.character.affiliation.toLowerCase() + " " + d.character.id.toLowerCase();
});
g.select('rect')
.attr('class', function(d){
return d.character.affiliation;
});
});
});
function wrangle(data) {
//var foo = data.scenes
console.log(data)
var charactersMap = {};
return data.scenes.map(function(scene){
return {characters: scene.map(function(id){
return characterById(id);
}).filter(function(d) { return (d); })};
});
// Helper to get characters by ID from the raw data
function characterById(id) {
charactersMap = charactersMap || {};
charactersMap[id] = charactersMap[id] || data.characters.find(function(character){
return character.id === id;
});
return charactersMap[id];
}
}
Raw
data.json
{
"characters": [
{
"id": "R2D",
"name": "R2-D2",
"affiliation": "light"
},
{
"id": "C3P",
"name": "C-3PO",
"affiliation": "light"
},
{
"id": "RO1",
"name": "Rebel Officers",
"affiliation": "light"
},
{
"id": "ST1",
"name": "Stormtroopers",
"affiliation": "dark"
},
{
"id": "DV1",
"name": "Anakin Skywalker / Darth Vader",
"affiliation": "vader"
},
{
"id": "PL1",
"name": "Princess Leia Organa",
"affiliation": "light"
},
{
"id": "JW1",
"name": "Jawas",
"affiliation": "other"
},
{
"id": "LS1",
"name": "Luke Skywalker",
"affiliation": "light"
},
{
"id": "OL1",
"name": "Owen Lars",
"affiliation": "other"
},
{
"id": "BL1",
"name": "Beru Lars",
"affiliation": "other"
},
{
"id": "TR1",
"name": "Tusken Raiders",
"affiliation": "other"
},
{
"id": "OB1",
"name": "Obi-Wan Kenobi",
"affiliation": "light"
},
{
"id": "GT1",
"name": "General Tagge",
"affiliation": "dark"
},
{
"id": "AM1",
"name": "Admiral Motti",
"affiliation": "dark"
},
{
"id": "GMT",
"name": "Grand Moff Tarkin",
"affiliation": "dark"
},
{
"id": "CB1",
"name": "Chewbacca",
"affiliation": "light"
},
{
"id": "HS1",
"name": "Han Solo",
"affiliation": "light"
},
{
"id": "GR1",
"name": "Greedo",
"affiliation": "other"
},
{
"id": "JTH",
"name": "Jabba The Hutt",
"affiliation": "other"
},
{
"id": "GW1",
"name": "General Willard",
"affiliation": "light"
},
{
"id": "GJD",
"name": "General Jan Dodonna",
"affiliation": "light"
},
{
"id": "JV1",
"name": "Jon 'Dutch' Vander",
"affiliation": "light"
},
{
"id": "WA1",
"name": "Wedge Antilles",
"affiliation": "light"
},
{
"id": "BD2",
"name": "Biggs Darklighter",
"affiliation": "light"
},
{
"id": "GD1",
"name": "Garven Dreis",
"affiliation": "light"
},
{
"id": "JP1",
"name": "Jek Porkins",
"affiliation": "light"
},
{
"id": "DT1",
"name": "Dex Tiree",
"affiliation": "light"
},
{
"id": "DK1",
"name": "Davish Krail",
"affiliation": "light"
},
{
"id": "TN1",
"name": "Theron Nett",
"affiliation": "light"
},
{
"id": "PN1",
"name": "Puck Naeco",
"affiliation": "light"
}
],
"scenes": [
[
"R2D",
"C3P",
"DV1",
"ST1",
"RO1"
],
[
"R2D",
"C3P",
"DV1",
"PL1"
],
[
"DV1",
"PL1"
],
[
"R2D",
"C3P"
],
[
"R2D",
"C3P",
"ST1",
"JW1"
],
[
"R2D",
"C3P",
"LS1",
"OL1",
"BL1",
"JW1"
],
[
"R2D",
"C3P",
"LS1"
],
[
"LS1",
"OL1",
"BL1"
],
[
"LS1",
"C3P",
"OL1",
"BL1",
""
],
[
"LS1",
"C3P",
"R2D",
"TR1"
],
[
"LS1",
"OB1",
"R2D",
"C3P",
"TR1"
],
[
"LS1",
"OB1",
"R2D",
"C3P"
],
[
"LS1",
"OB1",
"R2D",
"C3P"
],
[
"GT1",
"AM1",
"DV1",
"GMT"
],
[
"LS1",
"OB1",
"R2D",
"C3P",
"OL1",
"BL1"
],
[
"DV1",
"PL1"
],
[
"LS1",
"OB1",
"R2D",
"C3P"
],
[
"LS1",
"OB1",
"R2D",
"C3P"
],
[
"LS1",
"OB1",
"R2D",
"C3P",
"CB1"
],
[
"LS1",
"OB1",
"CB1",
"HS1"
],
[
"HS1",
"GR1"
],
[
"DV1",
"GMT",
"GT1",
"AM1",
"R2D",
"LS1",
"OB1",
"C3P"
],
[
"HS1",
"CB1",
"JTH"
],
[
"LS1",
"OB1",
"R2D",
"C3P",
"HS1",
"CB1",
"ST1"
],
[
"GMT",
"DV1",
"PL1",
"AMI"
],
[
"LS1",
"OB1",
"R2D",
"C3P",
"HS1",
"CB1",
"GMT",
"DV1",
""
],
[
"HS1",
"CB1",
"LS1",
"OB1",
"ST1"
],
[
"DV1",
"GMT"
],
[
"DV1",
"ST1",
"LS1",
"HS1",
"OB1",
"CB1",
"R2D",
"C3P"
],
[
"LS1",
"HS1",
"OB1",
"CB1",
"R2D",
"C3P",
"ST1"
],
[
"LS1",
"HS1",
"OB1",
"CB1",
"DV1"
],
[
"LS1",
"HS1",
"CB1",
"PL1",
"ST1"
],
[
"DV1",
"GMT"
],
[
"HS1",
"LS1",
"PL1",
"CB1",
"C3P",
"R2D"
],
[
"LS1",
"HS1",
"PL1",
"CB1"
],
[
"LS1",
"HS1",
"PL1",
"CB1",
"C3P",
"R2D",
"ST1"
],
[
"OB1",
"LS1",
"HS1",
"PL1",
"CB1",
"ST1"
],
[
"LS1",
"PL1",
"HS1",
"CB1",
"R2D",
"C3P",
"OB1",
"ST1"
],
[
"LS1",
"PL1"
],
[
"DV1",
"LS1",
"PL1",
"HS1",
"CB1",
"R2D",
"C3P",
"OB1",
"ST1"
],
[
"DV1",
"LS1",
"PL1",
"HS1",
"CB1",
"R2D",
"C3P",
"OB1",
"ST1"
],
[
"LS1",
"HS1",
"PL1",
"CB1",
"C3P",
"R2D"
],
[
"DV1",
"GMT"
],
[
"DV1",
"GMT",
"HS1",
"LS1",
"PL1",
"CB1"
],
[
"LS1",
"PL1",
"HS1",
"CB1",
"R2D",
"C3P",
"RO1",
"GW1"
],
[
"DV1",
"GMT"
],
[
"GJD",
"PL1",
"LS1",
"HS1",
"CB1",
"RO1",
"JV1",
"WA1"
],
[
"DV1",
"GMT"
],
[
"HS1",
"CB1",
"LS1",
"C3P",
"RO1"
],
[
"LS1",
"PL1",
"R2D",
"C3P",
"BD2",
"RO1",
"GD1"
],
[
"PL1",
"C3P",
"LS1",
"BD2",
"JP1",
"GJD",
"WA1",
"R2D",
"GD1"
],
[
"DV1"
],
[
"LS1",
"GJD",
"WA1",
"BD2",
"PL1",
"C3P",
"PN1",
"TN1",
"DK1",
"JV1",
"DT1",
"GD1"
],
[
"LS1",
"HS1",
"DV1",
"CB1",
"PL1",
"C3P",
"GJD"
],
[
"PL1",
"HS1",
"LS1",
"C3P",
"CB1",
"R2D",
"RO1"
],
[
"PL1",
"HS1",
"LS1",
"C3P",
"CB1",
"R2D",
"RO1",
"GJD"
]
]
}
Raw
GoT_narrative_draft.json
{
"characters": [
{"id": "Jora", "name": "Jorah", "affiliation": "0"},
{"id": "Balo", "name": "Balon", "affiliation": "0"},
{"id": "Lora", "name": "Loras", "affiliation": "0"},
{"id": "Barr", "name": "Barristan", "affiliation": "0"},
{"id": "Greg", "name": "Gregor", "affiliation": "0"},
{"id": "Houn", "name": "Hound", "affiliation": "0"},
{"id": "Blac", "name": "Blackfish", "affiliation": "0"},
{"id": "Tyri", "name": "Tyrion", "affiliation": "1"},
{"id": "Jaim", "name": "Jaime", "affiliation": "1"},
{"id": "Litt", "name": "Littlefinger", "affiliation": "1"},
{"id": "Bron", "name": "Bronn", "affiliation": "1"},
{"id": "Vary", "name": "Varys", "affiliation": "1"},
{"id": "Aemo", "name": "Aemon", "affiliation": "2"},
{"id": "Pyce", "name": "Pycelle", "affiliation": "2"},
{"id": "Doth", "name": "Dothraki", "affiliation": "3"},
{"id": "Hizd", "name": "Hizdahr", "affiliation": "3"},
{"id": "Daen", "name": "Daenerys", "affiliation": "3"},
{"id": "Drog", "name": "Drogo", "affiliation": "3"},
{"id": "Sam", "name": "Sam", "affiliation": "4"},
{"id": "Theo", "name": "Theon", "affiliation": "4"},
{"id": "Asha", "name": "Asha", "affiliation": "4"},
{"id": "Bran", "name": "Bran", "affiliation": "4"},
{"id": "Jon", "name": "Jon", "affiliation": "4"},
{"id": "Meli", "name": "Melisandre", "affiliation": "5"},
{"id": "Rams", "name": "Ramsay", "affiliation": "6"},
{"id": "Wald", "name": "Walder", "affiliation": "6"},
{"id": "Sans", "name": "Sansa", "affiliation": "7"},
{"id": "Cate", "name": "Catelyn", "affiliation": "7"},
{"id": "Robb", "name": "Robb", "affiliation": "7"},
{"id": "Brie", "name": "Brienne", "affiliation": "7"},
{"id": "Arya", "name": "Arya", "affiliation": "7"},
{"id": "Edda", "name": "Eddard", "affiliation": "7"},
{"id": "Manc", "name": "Mance", "affiliation": "8"},
{"id": "Tomm", "name": "Tommen", "affiliation": "9"},
{"id": "Renl", "name": "Renly", "affiliation": "9"},
{"id": "Joff", "name": "Joffrey", "affiliation": "9"},
{"id": "Robe", "name": "Robert", "affiliation": "9"},
{"id": "Lysa", "name": "Lysa", "affiliation": "9"},
{"id": "Cers", "name": "Cersei", "affiliation": "9"},
{"id": "Marg", "name": "Margaery", "affiliation": "9"},
{"id": "Stan", "name": "Stannis", "affiliation": "10"},
{"id": "Tywi", "name": "Tywin", "affiliation": "10"},
{"id": "Davo", "name": "Davos", "affiliation": "11"}
],
"scenes": [
[],
["Jon", "Bran", "Robb", "Theo"],
["Jon", "Edda", "Cate", "Robe"],
["Daen", "Doth", "Drog"],
["Jon", "Tyri", "Jaim", "Sans", "Edda", "Cate", "Robb", "Robe", "Tywi"],
["Jon", "Bran", "Edda", "Cate", "Robb", "Robe"],
["Jon", "Arya", "Bran", "Sans", "Robb", "Joff", "Tomm"],
["Jon", "Bran", "Robb", "Robe"],
["Jon", "Tyri", "Arya", "Jaim", "Bran", "Edda", "Cers", "Robb", "Joff", "Houn", "Tomm"],
["Daen", "Jora", "Doth", "Drog"],
["Jon", "Jaim", "Edda", "Robe", "Tywi", "Jora", "Doth"],
["Jon", "Tyri"],
["Bran", "Edda", "Cate", "Robb", "Theo"],
["Arya", "Sans", "Joff", "Houn"],
["Arya", "Sans", "Edda", "Cers", "Robe", "Joff"],
["Bran"],
["Bran"],
["Jon", "Tyri", "Bran", "Cate", "Robb", "Litt", "Vary"],
["Jon", "Arya", "Bran", "Sans", "Edda", "Cate", "Robe", "Litt", "Vary", "Renl", "Pyce"],
["Jon", "Tyri"],
["Jon", "Arya", "Sans", "Joff"],
["Daen", "Jora", "Doth", "Drog"],
["Jon", "Tyri", "Bran", "Robb", "Theo"],
["Jon", "Arya", "Bran", "Edda", "Sam", "Litt", "Pyce"],
["Jon", "Edda", "Stan", "Robe", "Renl"],
["Cate"],
["Jaim", "Sans", "Joff", "Houn", "Renl", "Lora", "Greg"],
["Jon", "Arya", "Jaim", "Bran", "Sans", "Edda", "Cers", "Robe", "Litt", "Houn", "Barr", "Vary", "Renl", "Lora", "Greg"],
["Tyri", "Cate", "Litt", "Bron"],
["Jon", "Arya", "Edda", "Tomm"],
["Edda", "Cate", "Robe", "Litt", "Barr", "Vary"],
["Jon", "Tyri", "Edda", "Cate", "Robe", "Lysa", "Bron", "Blac"],
["Jaim", "Edda", "Robe", "Litt"],
["Daen", "Jora", "Doth", "Drog"],
["Jon", "Bran", "Robb", "Theo"],
["Tyri", "Jaim", "Cate", "Lysa"],
["Jaim", "Edda", "Cers", "Robe"],
["Jon", "Tyri", "Jaim", "Cate", "Robe", "Sam", "Litt", "Aemo", "Lysa", "Bron"],
["Tyri", "Jaim", "Tywi", "Bron"],
["Edda", "Robe", "Tywi", "Litt", "Vary", "Lora", "Pyce", "Greg"],
["Arya", "Sans", "Edda", "Joff", "Lora"],
["Jon", "Jaim", "Edda", "Cers", "Robe", "Tywi", "Litt", "Pyce"],
["Daen", "Jora", "Doth", "Drog"],
["Jon", "Edda", "Cers", "Stan", "Robe", "Sam", "Joff", "Litt", "Barr", "Vary", "Renl", "Aemo", "Pyce"],
["Sans", "Edda", "Cers", "Robe", "Joff", "Litt", "Houn", "Barr", "Vary", "Renl", "Pyce"],
["Arya", "Bran", "Robb"],
["Jon", "Arya", "Sans", "Edda", "Cers", "Robb", "Robe", "Sam", "Joff", "Litt", "Vary", "Aemo", "Pyce"],
["Bran", "Robb"],
["Daen", "Jora", "Doth", "Drog"],
["Jaim", "Edda", "Cate", "Robb", "Tywi", "Blac"],
["Tyri", "Jaim", "Tywi", "Bron"],
["Sans", "Cers", "Stan", "Robe", "Joff", "Barr", "Vary", "Pyce"],
["Edda", "Cers", "Stan", "Robe", "Litt", "Vary"],
["Jon", "Jaim", "Edda", "Cate", "Robb", "Sam", "Theo", "Tywi", "Wald", "Aemo", "Blac"],
["Daen", "Jora", "Doth", "Drog"],
["Tyri", "Tywi", "Bron", "Greg"],
["Jaim", "Edda", "Cate", "Robb", "Theo", "Blac"],
["Daen", "Jora", "Doth", "Drog"],
["Arya", "Sans", "Joff"],
["Bran"],
["Sans", "Joff", "Houn"],
["Daen", "Jora", "Doth", "Drog"],
["Jon", "Tyri", "Jaim", "Edda", "Stan", "Robb", "Sam", "Tywi", "Renl"],
["Edda", "Cate", "Stan", "Robb", "Theo", "Tywi", "Renl", "Lysa", "Blac"],
["Daen", "Jora", "Doth", "Drog"],
["Edda", "Stan", "Robe", "Davo", "Renl", "Meli"],
["Arya"],
["Tyri", "Sans", "Robb", "Joff", "Houn", "Tomm"],
["Tyri", "Jaim", "Edda", "Cers", "Robe", "Joff", "Tywi", "Litt", "Barr", "Vary", "Bron"],
["Bran", "Robb", "Wald"],
["Jon", "Arya", "Robb", "Sam", "Renl", "Aemo"],
["Jaim", "Edda", "Cers", "Cate", "Robb", "Theo", "Tywi", "Blac"],
["Tyri", "Cers", "Joff", "Vary"],
["Arya"],
["Stan", "Robe", "Davo", "Renl", "Meli"],
["Edda", "Robb", "Robe", "Theo", "Balo"],
["Jon", "Daen", "Robe", "Sam", "Jora", "Doth", "Drog"],
["Arya"],
["Tyri", "Cers", "Stan", "Joff", "Litt", "Vary", "Bron", "Pyce"],
["Bran", "Robb", "Wald"],
["Tyri", "Cers", "Stan", "Joff", "Litt", "Vary", "Renl", "Lysa", "Bron", "Tomm", "Pyce"],
["Sans", "Joff", "Houn"],
["Arya"],
["Tyri", "Jaim", "Cers", "Robb", "Renl", "Bron"],
["Bran", "Robb", "Wald"],
["Jon", "Edda", "Cate", "Stan", "Robb", "Robe", "Sam", "Brie", "Renl", "Manc", "Lora"],
["Theo", "Asha", "Balo"],
["Tyri", "Cers", "Stan", "Robe", "Litt", "Vary", "Renl", "Bron", "Pyce"],
["Arya", "Tywi", "Greg"],
["Daen", "Robe", "Jora", "Doth", "Drog"],
["Bran"],
["Tyri", "Jaim", "Cers", "Vary", "Bron"],
["Arya", "Joff", "Tywi", "Greg"],
["Edda", "Cers", "Cate", "Stan", "Robe", "Brie", "Renl"],
["Tyri", "Sans", "Robb", "Joff", "Houn"],
["Jon", "Bran", "Edda", "Cate", "Stan", "Robb", "Robe", "Brie", "Renl"],
["Bran", "Robb", "Wald"],
["Tyri", "Cers", "Stan", "Joff", "Litt", "Vary", "Renl", "Lora"],
["Theo"],
["Arya", "Tywi"],
["Jaim", "Edda", "Cate", "Stan", "Robb", "Brie", "Tywi", "Wald", "Renl", "Lysa", "Blac"],
["Daen", "Jora"],
["Tyri", "Sans", "Cers", "Stan", "Joff", "Houn", "Vary", "Bron", "Tomm", "Balo"],
["Jon", "Stan", "Robe", "Sam", "Davo", "Renl", "Manc", "Meli"],
["Tyri", "Jaim", "Cers", "Stan", "Vary", "Bron", "Tomm"],
["Arya", "Sans", "Edda", "Cate", "Robb", "Brie", "Tywi"],
["Bran", "Robb", "Theo"],
["Arya", "Tywi"],
["Daen"],
["Tyri", "Cers", "Stan", "Joff", "Bron", "Balo"],
["Jon", "Bran", "Edda", "Theo", "Asha"],
["Jon", "Tyri", "Sans", "Stan", "Robe", "Joff", "Houn"],
["Tyri", "Jaim", "Cers", "Vary", "Tomm"],
["Tyri", "Jaim", "Bran", "Edda", "Cers", "Cate", "Robb", "Robe", "Theo", "Brie", "Litt"],
["Bran", "Edda", "Theo", "Asha"],
["Tyri", "Sans", "Joff"],
["Stan", "Davo"],
["Tyri", "Stan", "Joff", "Houn"],
["Jaim", "Sans", "Cers", "Stan"],
["Tyri", "Stan", "Balo"],
["Sans", "Cers", "Stan", "Joff", "Houn", "Renl"],
["Daen", "Jora", "Barr", "Doth"],
["Arya", "Bran", "Robb", "Joff", "Tywi"],
["Sans", "Cers", "Joff", "Tywi", "Litt", "Lora", "Marg"],
["Theo"],
["Jon", "Tyri", "Jaim"],
["Bran"],
["Jon", "Sam", "Aemo", "Manc"],
["Tyri", "Jaim", "Cers", "Cate", "Brie"],
["Jaim", "Edda", "Cate", "Robb", "Brie", "Lysa"],
["Arya"],
["Tyri", "Jaim", "Cers", "Stan", "Tywi", "Bron", "Tomm"],
["Stan", "Davo"],
["Jon", "Sans", "Robe", "Joff", "Houn", "Renl", "Manc", "Lora", "Marg"],
["Daen", "Jora", "Barr", "Doth"],
["Bran", "Robb"],
["Stan", "Davo", "Meli"],
["Jaim", "Cers", "Brie"],
["Tyri", "Cers", "Vary", "Bron", "Lora", "Pyce"],
["Arya"],
["Jon", "Jaim", "Bran", "Cate", "Robb", "Theo", "Tywi", "Wald", "Manc", "Blac"],
["Sans", "Joff", "Lora", "Marg"],
["Arya", "Tywi"],
["Jon", "Sam"],
["Tyri", "Sans", "Cers", "Stan", "Robb", "Robe", "Joff", "Tywi", "Litt", "Vary", "Lysa", "Balo"],
["Edda", "Cate", "Robb", "Blac"],
["Jaim", "Brie"],
["Arya", "Jaim", "Robe"],
["Daen", "Jora", "Barr", "Doth", "Drog"],
["Bran"],
["Jon", "Stan", "Joff", "Davo", "Manc", "Meli"],
["Daen", "Jora"],
["Tyri", "Sans", "Cers", "Joff", "Marg"],
["Jon", "Arya", "Jaim"],
["Tyri", "Jaim", "Cers", "Brie"],
["Tyri", "Sans", "Cers", "Joff", "Tywi", "Vary", "Bron", "Pyce"],
["Jon", "Sam"],
["Arya", "Edda", "Robe", "Houn"],
["Jaim", "Bran", "Sans", "Cate", "Robb", "Theo", "Wald", "Blac"],
["Stan", "Robe", "Joff", "Davo", "Renl", "Meli"],
["Jaim", "Robb", "Robe", "Brie"],
["Tyri", "Cers", "Joff", "Tywi", "Bron"],
["Arya", "Houn"],
["Jon", "Bran", "Manc"],
["Daen", "Jora", "Barr"],
["Jon", "Arya", "Edda", "Blac"],
["Jaim", "Cers", "Brie", "Tywi"],
["Jon", "Bran", "Edda", "Cate", "Robb", "Theo", "Wald", "Balo"],
["Sam"],
["Jon", "Arya", "Sam", "Joff", "Houn", "Aemo", "Manc", "Greg"],
["Cate", "Robb", "Litt", "Wald"],
["Arya", "Houn"],
["Edda", "Cate", "Robb", "Wald"],
["Arya", "Houn"],
["Tyri", "Sans", "Cers", "Robe", "Joff", "Tywi", "Litt", "Wald", "Greg"],
["Jon", "Stan", "Robe", "Davo", "Aemo", "Meli"],
["Jon", "Bran", "Sam"],
["Daen", "Jora", "Barr", "Doth"],
["Tyri", "Sans"],
["Tyri", "Bran", "Sans", "Robb", "Joff"],
["Tyri", "Jaim", "Sans", "Cers", "Joff", "Tywi", "Renl", "Lora", "Marg"],
["Tyri", "Sans", "Joff", "Litt"],
["Tyri", "Jaim", "Cers", "Cate", "Robe", "Joff", "Brie", "Tywi", "Renl", "Lora", "Balo"],
["Jon", "Stan", "Joff", "Davo", "Aemo", "Manc", "Meli"],
["Arya", "Houn"],
["Tyri", "Sans", "Cers", "Joff", "Tywi", "Vary", "Bron", "Pyce", "Greg"],
["Tyri", "Jaim", "Cers", "Robe", "Joff", "Brie", "Barr", "Renl", "Tomm", "Lora", "Balo"],
["Jon", "Tyri", "Sans", "Robe", "Joff", "Litt", "Aemo", "Lysa", "Manc", "Lora", "Marg"],
["Tyri", "Sans", "Cers", "Joff", "Tywi", "Tomm", "Greg"],
["Daen", "Jora", "Barr", "Drog"],
["Jon", "Tyri", "Arya", "Jaim", "Sans", "Edda", "Cers", "Cate", "Stan", "Robb", "Robe", "Joff", "Brie", "Tywi", "Tomm", "Manc", "Lora"],
["Tyri", "Arya", "Sans", "Joff", "Houn", "Greg"],
["Jon", "Stan", "Robb", "Sam", "Aemo", "Manc", "Meli"],
["Tyri", "Jaim", "Tywi", "Vary"],
["Jon", "Stan", "Robb", "Sam", "Aemo", "Manc", "Meli"],
["Jon", "Arya", "Sans", "Cate", "Robe", "Litt", "Lysa"],
["Litt", "Wald"],
[],
["Tywi", "Asha", "Balo"],
["Tyri", "Jaim", "Cers", "Stan", "Robe", "Tywi", "Tomm", "Pyce"],
["Jaim", "Sans", "Joff", "Brie", "Renl"],
["Jon", "Stan", "Sam", "Aemo", "Manc"],
["Arya"],
["Tyri", "Jaim", "Cers", "Joff", "Tywi", "Litt", "Tomm", "Marg", "Pyce"],
["Tyri", "Jaim", "Cers", "Tywi", "Vary", "Tomm", "Lora", "Pyce"],
["Tyri", "Jaim", "Sans", "Cate", "Brie", "Tywi"],
["Jon", "Sans", "Robe", "Theo", "Litt", "Asha", "Lysa", "Balo"],
["Tyri", "Jaim", "Cers", "Joff", "Tomm", "Lora", "Marg"],
["Joff"],
["Brie", "Renl"],
["Jon", "Sam", "Aemo"],
["Tyri", "Jaim", "Cers", "Tywi", "Houn", "Tomm", "Lora", "Marg"],
["Tyri", "Jaim", "Edda", "Cers", "Stan", "Robe", "Litt", "Wald", "Marg", "Pyce"],
["Asha", "Balo"],
["Asha", "Balo"],
["Jaim", "Brie"],
[],
["Arya", "Sans"],
["Robe", "Litt", "Lysa"],
["Tyri", "Jaim", "Cers", "Robe", "Bron", "Tomm", "Lora", "Marg"],
["Brie", "Houn"],
["Jon", "Sam", "Aemo"],
["Jaim", "Cers", "Robe", "Brie", "Houn", "Greg"],
["Cers", "Robe", "Joff", "Tomm", "Lora", "Marg", "Pyce"],
["Balo"],
["Tyri", "Jaim", "Cers", "Robe", "Houn"],
["Jaim", "Brie", "Houn"],
["Jaim", "Cers", "Stan", "Robe", "Bron", "Lora", "Marg", "Pyce"],
["Jaim", "Cers", "Tywi", "Wald", "Blac"],
["Arya"],
["Jon", "Sam", "Aemo"],
["Tyri", "Jaim", "Cers", "Tomm", "Lora", "Marg", "Pyce"],
["Sans", "Brie", "Houn", "Renl"],
["Jaim", "Cate", "Wald", "Blac"],
["Cers", "Tywi", "Tomm", "Lora", "Marg", "Pyce"],
["Jon", "Sans", "Robe", "Litt", "Lysa"],
["Jaim", "Sans", "Cate", "Brie", "Houn", "Renl"],
["Jaim", "Cers", "Tomm", "Marg", "Pyce"],
["Jaim", "Cers", "Wald", "Tomm", "Blac"],
["Jon", "Sam", "Aemo"],
["Manc"],
["Tyri", "Jaim", "Stan", "Tywi", "Vary"],
["Jon", "Daen", "Stan", "Robb", "Barr", "Manc", "Meli", "Hizd"],
["Bran"],
["Tyri", "Daen", "Vary", "Doth"],
["Jon", "Stan", "Sam", "Aemo", "Manc"],
["Tyri", "Tywi"],
["Jon", "Stan", "Robe", "Davo", "Tywi", "Aemo", "Manc", "Meli"],
["Daen", "Joff", "Barr", "Hizd"],
["Arya", "Theo", "Wald", "Rams"],
["Bran"],
["Tyri"],
["Stan", "Davo"],
["Jon", "Daen", "Stan", "Barr", "Doth", "Meli"],
["Tyri"],
["Stan", "Robb", "Davo"],
["Jon", "Robb", "Theo", "Manc", "Balo", "Rams"],
["Tyri", "Daen", "Doth"],
["Daen", "Barr", "Hizd"],
["Jon", "Daen"],
["Daen"],
["Asha", "Balo"],
["Jon", "Tyri", "Arya", "Daen", "Cers", "Jora", "Meli"],
["Edda", "Stan", "Davo", "Rams"],
["Daen", "Barr", "Hizd"],
["Jon", "Stan", "Meli"],
["Edda", "Stan", "Theo", "Wald", "Rams"],
["Tyri", "Daen", "Jora"],
["Jon", "Arya", "Bran", "Edda", "Stan", "Manc", "Blac"],
["Arya", "Daen", "Stan", "Theo", "Barr", "Doth", "Hizd", "Rams"],
["Jon", "Cers", "Stan", "Tomm", "Balo", "Greg"],
["Tyri", "Daen", "Jora"],
["Arya", "Edda", "Stan", "Theo", "Rams"],
["Edda", "Stan", "Robe", "Theo", "Asha"],
["Jon", "Arya", "Daen", "Stan", "Robe", "Barr", "Meli", "Hizd"],
["Jon", "Arya", "Bran", "Stan", "Theo", "Rams"],
["Tyri", "Jora"],
["Jon", "Jaim", "Stan", "Meli", "Blac"],
["Daen", "Barr", "Hizd"],
["Arya", "Stan", "Theo", "Rams"],
["Jon", "Daen", "Barr", "Manc", "Doth", "Hizd"],
["Tyri", "Jaim", "Cers", "Stan", "Robe", "Tomm", "Marg"],
["Daen", "Barr", "Hizd"],
[],
["Jon", "Tyri", "Daen", "Jora", "Barr", "Manc", "Hizd"],
[],
["Jon", "Stan", "Robe"],
["Stan", "Asha"],
["Arya"],
["Jaim", "Edda", "Cers", "Robe", "Tomm"],
["Tyri", "Jora"],
["Daen", "Barr", "Hizd"],
["Jon", "Daen", "Manc", "Meli", "Rams"],
["Daen", "Barr", "Hizd"],
["Daen", "Jora", "Doth", "Drog", "Hizd"]
]
}
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
text {
font-family: "ProximaNova",Helvetica,Arial,sans-serif;
font-size: 14px;
}
rect {
fill: lightgray;
stroke: #000;
}
path {
fill: none;
stroke-width: 1;
stroke: #333;
}
path.tool {
stroke: #3c6da8;
}
path.application {
stroke: #df2929;
}
path.fd {
stroke-width: 5;
}
text.fd {
font-weight: bold;
}
path.twe {
stroke-width: 5;
}
text.twe {
font-weight: bold;
}
path.kds {
stroke-width: 5;
}
text.kds {
font-weight: bold;
}
path.uid {
font-weight: bold;
}
path.ct {
stroke-width: 5;
}
text.ct {
font-weight: bold;
}
.intro text:first-child {
fill: #fff;
stroke: #f9f9f9;
stroke-width: 3;
}
.intro text+text {
fill: #333;
}
.intro text+text.application {
fill: #df2929;
}
.intro text+text.tool {
fill: #3c6da8;
}
</style>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.js"></script>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://cdn.rawgit.com/abcnews/d3-layout-narrative/1.0.0/narrative.js"></script>
<script src="chart.js"></script>
Raw
LotR.json
{
"characters": [
{"id": "PS", "name": "Program Synthesis by Example", "affiliation": "tool"},
{"id": "PA", "name": "Program Analysis", "affiliation": "tool"},
{"id": "Bio", "name": "Biomedical Engineering", "affiliation": "application"},
{"id": "SP", "name": "Signal Processing", "affiliation": "tool"},
{"id": "SML", "name": "Supervised Machine Learning", "affiliation": "tool"},
{"id": "UML", "name": "Semi-supervised Machine Learning", "affiliation": "tool"},
{"id": "FD", "name": "Feature Design", "affiliation": "tool"},
{"id": "UR", "name": "Underactuated Robotics Planning and Control", "affiliation": "application"},
{"id": "KDS", "name": "Knowledge Discovery & Data-Mining", "affiliation": "application"},
{"id": "TWE", "name": "Teaching Humans by Example", "affiliation": "application"},
{"id": "VDD", "name": "Visual Display Design", "affiliation": "tool"},
{"id": "DS", "name": "Data Science", "affiliation": "application"},
{"id": "TME", "name": "Teaching Machines by Example", "affiliation": "application"},
{"id": "ID", "name": "Interaction Design", "affiliation": "tool"},
{"id": "CS", "name": "Crowdsourcing, i.e., Learner/Community-sourcing", "affiliation": "tool"},
{"id": "MMD", "name": "Mining massive datasets", "affiliation": "tool"},
{"id": "DDA", "name": "Discovering design alternatives", "affiliation": "application"}
],
"scenes": [
["Bio","SP", "SML", "FD"],
["UR", "FD"],
["FD","PA","VDD","ID","KDS","TWE"],
["FD","PA","KDS","TWE","ID"],
["VDD","TWE"],
["ID", "KDS","UML","TME"],
["PA","TME","KDS","ID","PS"],
["PA","VDD","TWE","KDS"]
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment