Skip to content

Instantly share code, notes, and snippets.

@jchakko

jchakko/data.json

Created April 18, 2020 23:36
Show Gist options
  • Save jchakko/368897a195a327f5250cf7098b600494 to your computer and use it in GitHub Desktop.
Save jchakko/368897a195a327f5250cf7098b600494 to your computer and use it in GitHub Desktop.
Download ZIP
Waterdeep Heist
Raw
data.json
{
"nodes": [
{
"id": 0,
"name": "Explosion",
"x": "188",
"y": "102.99999237060547",
"details": "Kythorn 11: Huge explosion outside Trollskull kills a dozen people and destroys the front of Beer & Spirit"
},
{
"id": 1,
"name": "Jesra",
"x": "252",
"y": "29.000001907348633",
"details": "Kythorn 11: Jesra tells Alvin a puppet without strings on the roof caused the explosion"
},
{
"id": 2,
"name": "Fleeing Figure",
"x": "88",
"y": "49",
"details": "Kythorn 11: A mysterious figure was spotted fleeing Trollskull after the explosion. It left behind bloody footprints as it went through the sewers and emerged new Grelhund Manor."
},
{
"id": 3,
"name": "Barnaby Blastwind",
"x": "35",
"y": "148",
"details": "Kythorn 11: Blastwind is in charge of clearing the mess caused by the explosion. He sizes up the BTC and us not to get involved"
},
{
"id": 4,
"name": "Fire Necklace",
"x": "238",
"y": "160",
"details": "An artificat that allows the user to cast huge fireballs. Could be the weapon used to cause the explosion. Kythorn 12: The necklace was reported missing"
},
{
"id": 5,
"name": "Order of the Magisters",
"x": "154",
"y": "224",
"details": "Administrative office that contains records about the magical artifacts"
},
{
"id": 6,
"name": "Jalester",
"x": "66",
"y": "259",
"details": "Kythorn 11: Jalester told Durin that the fire necklace was reported missing"
},
{
"id": 7,
"name": "Yowla Grelhund",
"x": "404",
"y": "142",
"details": "Mistress in charge of Grelhund Manor. Kythorn 13: Was on the second floor when Grelhund was attacked by the Black Network"
},
{
"id": 8,
"name": "Hrabbaz",
"x": "369",
"y": "206",
"details": "Guardian of Grelhund Manor. Kythorn 12: Visited Trollskull and brought the BTC to Grelhund. Kythorn 13: Helped secure Grelhund from the Black Network siege"
},
{
"id": 9,
"name": "Orond Grelhund",
"x": "488",
"y": "234",
"details": "Kythorn 13: Was taken hostage by Ulster during the siege of Grelhund by the Black Network"
},
{
"id": 10,
"name": "Stone of Golor",
"x": "614",
"y": "182",
"details": "Priceless artifact belonging to Dagult Neverember's treasure trove."
},
{
"id": 11,
"name": "Urstel",
"x": "653",
"y": "256",
"details": "Officer of the Black Network. Kythorn 13: Took Orond hostage during the siege of Grelhund. Demanded the Stone of Golor in return"
},
{
"id": 12,
"name": "Flying Snakes",
"x": "765",
"y": "252",
"details": "A group of snakes in a cage in the room where Ulster took Orond hostage. They can talk"
},
{
"id": 13,
"name": "The Black Network",
"x": "652",
"y": "339",
"details": "Offshoot of Zhent"
},
{
"id": 14,
"name": "Zhent",
"x": "719",
"y": "300",
"details": "Criminal organization"
},
{
"id": 15,
"name": "Renaer Neverember",
"x": "729",
"y": "94",
"details": "Kythorn 12: Renaer tells us that Beer & Spirit is probably collaterol damage over the battle for the stone of Gallor"
},
{
"id": 16,
"name": "Dagult Neverember",
"x": "561",
"y": "116.99999237060547",
"details": "Ranaer's estranged father who owns the stone"
},
{
"id": 17,
"name": "Dalakhar",
"x": "611",
"y": "59",
"details": "A gnome that worked for Dagult. Kythorn 12: Renaer tells us Dalakhar was killed in the explosion"
},
{
"id": 18,
"name": "Nim",
"x": "462",
"y": "43",
"details": "Robot that lives in the House of Inspired Hands. He has very little recollection of his past. Kythorn ?: He revealed that he created another robot in his image. Provided an umbrella that helps detect his likeness"
},
{
"id": 19,
"name": "Valleta",
"x": "542",
"y": "22",
"details": "Superviser at the House of Inspired Hands. She looks after Nim."
},
{
"id": 20,
"name": "Jim",
"x": "368",
"y": "43",
"details": "A clone of and created by Nim. Kythorn ?: Confessed to causing the explosion"
},
{
"id": 21,
"name": "Grinda Garloth",
"x": "823",
"y": "195",
"details": "??? Jim claims she currently posseses the Stone of Golor"
}
],
"links": [
{
"source": 0,
"target": 1,
"weight": 1
},
{
"source": 0,
"target": 2,
"weight": 1
},
{
"source": 0,
"target": 3,
"weight": 1
},
{
"source": 0,
"target": 4,
"weight": 1
},
{
"source": 0,
"target": 17,
"weight": 1
},
{
"source": 0,
"target": 20,
"weight": 1
},
{
"source": 1,
"target": 20,
"weight": 1
},
{
"source": 4,
"target": 5,
"weight": 1
},
{
"source": 4,
"target": 7,
"weight": 1
},
{
"source": 5,
"target": 6,
"weight": 1
},
{
"source": 7,
"target": 8,
"weight": 1
},
{
"source": 7,
"target": 9,
"weight": 1
},
{
"source": 7,
"target": 10,
"weight": 1
},
{
"source": 7,
"target": 20,
"weight": 1
},
{
"source": 9,
"target": 11,
"weight": 1
},
{
"source": 10,
"target": 11,
"weight": 1
},
{
"source": 10,
"target": 15,
"weight": 1
},
{
"source": 10,
"target": 16,
"weight": 1
},
{
"source": 10,
"target": 21,
"weight": 1
},
{
"source": 10,
"target": 20,
"weight": 1
},
{
"source": 11,
"target": 12,
"weight": 1
},
{
"source": 11,
"target": 13,
"weight": 1
},
{
"source": 13,
"target": 14,
"weight": 1
},
{
"source": 15,
"target": 16,
"weight": 1
},
{
"source": 15,
"target": 17,
"weight": 1
},
{
"source": 16,
"target": 17,
"weight": 1
},
{
"source": 18,
"target": 19,
"weight": 1
},
{
"source": 18,
"target": 20,
"weight": 1
}
]
}
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v3.min.js"></script>
<style>
.link {
stroke: #aaa;
}
.node text {
stroke:#333;
cursos:pointer;
}
.node circle{
stroke:#fff;
stroke-width:3px;
fill:#555;
}
</style>
<body>
<h1 align=center>The Case of the Humongous Fireball</h1>
<h4>It's a lot to take in. Feel free to move stuff around just put it back when you're done ok?</h4>
<script>
var c10 = d3.scale.category10();
var svg = d3.select("body")
.append("svg")
.attr("width", 1200)
.attr("height", 800);
d3.json("data.json", function(json) {
var desc = svg.append("foreignObject")
.attr("width", 480)
.attr("height", 500)
.attr("x", 100)
.attr("y", 300)
.append("xhtml:body")
.style("font", "14px 'Helvetica Neue'")
.html("<h1>The Case of the Humongous Fireball</h1><p>It's a lot to take in. Feel free to move stuff around just put it back when you're done ok?</p>");
var info = json;
console.log(info);
var drag = d3.behavior.drag()
.origin(function(d) { return d; })
.on("dragstart", dragstarted)
.on("drag", function(d, i) {
d3.select(this).attr("transform", "translate(" + (d.x = d3.event.x) + ","
+ (d.y = d3.event.y) + ")");
links.each(function(l, li) {
if (l.source == i) {
d3.select(this).attr("x1", d.x).attr("y1", d.y);
} else if (l.target == i) {
d3.select(this).attr("x2", d.x).attr("y2", d.y);
}
});
})
function dragstarted(d) {
d3.event.sourceEvent.stopPropagation();
d3.select(this).classed("dragging", true);
}
var links = svg.selectAll("link")
.data(json.links)
.enter()
.append("line")
.attr("class", "link")
.attr("x1", function(l) {
var sourceNode = json.nodes.filter(function(d, i) {
return i == l.source
})[0];
d3.select(this).attr("y1", sourceNode.y);
return sourceNode.x
})
.attr("x2", function(l) {
var targetNode = json.nodes.filter(function(d, i) {
return i == l.target
})[0];
d3.select(this).attr("y2", targetNode.y);
return targetNode.x
})
.attr("fill", "none")
.attr("stroke", "white");
var nodes = svg.selectAll("node")
.data(json.nodes)
.enter().append("g")
.attr("class", "node")
.attr("transform", function(d) { return 'translate(' + d.x + ' '+ d.y + ')'; })
.on("mouseover", function(d) {
console.log(d.details);
desc.html("<h1>"+d.name+"</h1><h4>"+d.details+"</h4>");
})
.call(drag);
nodes.append("circle")
.attr("r", 15)
.style("fill", function(d, i) {
return "pink";
})
.attr("class", "dong");
nodes.append("text")
.text(function(d) { return d.name })
.attr("fill", "blue");
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment