Jonathan Kawchuk - North Album Credits

credits.json

[
{"name":"credits.performer.Jonathan Kawchuk","size":2042,"imports":["credits.role.performer.Extended Piano","credits.role.performer.Heartbeats","credits.role.performer.Percussion","credits.role.performer.Piano","credits.role.performer.Voice","credits.Location.Europe.Denmark","credits.Location.Europe.Norway","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.role.technician.Composition and Production","credits.role.technician.Field Recording","credits.Location.NorthAmerica.Canada West","credits.role.design.Design","credits.Track.SideA.Right Into You","credits.Track.SideA.Aware","credits.Track.SideA.That So (+ Nadia Sirota)","credits.Track.SideA.Overhang","credits.Track.SideA.Ebb","credits.Track.SideB.Fast Twitch","credits.Track.SideB.Bodied","credits.Track.SideB.Lagos","credits.Track.SideB.Honeymoon"]},
{"name":"credits.performer.cluster.John Baron","size":3938,"imports":["credits.role.performer.Double Bass","credits.role.performer.Viola","credits.Location.NorthAmerica.Canada West","credits.Track.SideA.That So (+ Nadia Sirota)"]},
{"name":"credits.performer.cluster.Nils Børstrand","size":3812,"imports":["credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos"]},
{"name":"credits.performer.cluster.Eline Brun","size":6714,"imports":["credits.Location.Europe.Norway","credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos","credits.role.Thanks.Thank You"]},
{"name":"credits.performer.cluster.Morten Evensen","size":743,"imports":["credits.role.performer.Horn","credits.Location.Europe.United Kingdom","credits.Track.SideB.Fast Twitch","credits.Track.SideB.Honeymoon"]},
{"name":"credits.performer.cluster.Liam Hockley","size":3534,"imports":["credits.role.performer.Clarinet","credits.Location.NorthAmerica.Canada West","credits.Track.SideB.Honeymoon"]},
{"name":"credits.performer.cluster.Daylan Law","size":5731,"imports":["credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos"]},
{"name":"credits.performer.cluster.Jeremiah Levine","size":7840,"imports":["credits.role.performer.Voice","credits.Location.NorthAmerica.Canada West","credits.Track.SideB.Fast Twitch","credits.role.Thanks.Thank You"]},
{"name":"credits.performer.cluster.Andrew Macdonald","size":7840,"imports":["credits.role.performer.Voice","credits.Location.NorthAmerica.Canada West","credits.Track.SideB.Fast Twitch"]},
{"name":"credits.performer.cluster.Gur Magen","size":5914,"imports":["credits.role.technician.Additional Recording","credits.Location.Other.Occupied Palestinian Territories","credits.Track.SideA.Aware"]},
{"name":"credits.performer.cluster.Katlin Mathison","size":3416,"imports":["credits.Track.SideA.Right Into You","credits.role.performer.Organ","credits.Location.Europe.Norway","credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos","credits.role.Thanks.Thank You"]},
{"name":"credits.performer.cluster.Tom Moth","size":7074,"imports":["credits.role.performer.Harp","credits.Location.Europe.United Kingdom","credits.Track.SideA.Ebb"]},
{"name":"credits.performer.cluster.Anat Nevo","size":17010,"imports":["credits.role.performer.Cello","credits.Location.Other.Occupied Palestinian Territories","credits.Track.SideA.Aware"]},
{"name":"credits.performer.cluster.Gøril Nilsen","size":5842,"imports":["credits.role.performer.Heartbeats","credits.role.performer.Joik","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos"]},
{"name":"credits.performer.cluster.Tom O’Connor","size":1983,"imports":["credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos","credits.role.Thanks.Thank You"]},
{"name":"credits.performer.cluster.Sturle Sandvik","size":2047,"imports":["credits.role.performer.Guitar","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos"]},
{"name":"credits.performer.cluster.Lill Scheie","size":1375,"imports":["credits.Location.Europe.Norway","credits.role.performer.Heartbeats","credits.role.performer.Voice","credits.Location.Europe.Portugal","credits.Location.Europe.United Kingdom","credits.Track.SideB.Lagos","credits.role.Thanks.Thank You"]},
{"name":"credits.performer.cluster.Anna Siminoski","size":8746,"imports":["credits.role.performer.Clarinet","credits.Location.NorthAmerica.Canada West","credits.Track.SideB.Honeymoon"]},
{"name":"credits.performer.cluster.Nadia Sirota","size":2202,"imports":["credits.role.performer.Viola","credits.Location.Europe.Iceland","credits.Track.SideA.That So (+ Nadia Sirota)"]},
{"name":"credits.performer.cluster.Phil Steventon","size":1382,"imports":["credits.role.performer.Marimba","credits.role.performer.Vibraphone","credits.Location.Europe.United Kingdom","credits.Track.SideA.Ebb"]},
{"name":"credits.technician.cluster.Anthony Cenerini","size":1629,"imports":["credits.role.technician.Additional Recording","credits.Track.SideA.That So (+ Nadia Sirota)","credits.Location.NorthAmerica.Canada West"]},
{"name":"credits.technician.cluster.Paul Evans","size":1675,"imports":["credits.Location.Europe.Iceland","credits.role.technician.Additional Recording","credits.role.technician.Mastered","credits.role.technician.Mixed","credits.Track.SideA.Right Into You","credits.Track.SideA.Aware","credits.Track.SideA.That So (+ Nadia Sirota)","credits.Track.SideA.Overhang","credits.Track.SideA.Ebb","credits.role.Thanks.Thank You","credits.role.Thanks.Thank You","credits.Track.SideB.Fast Twitch","credits.Track.SideB.Bodied","credits.Track.SideB.Lagos","credits.Track.SideB.Honeymoon"]},
{"name":"credits.technician.cluster.Daniel Rejmer","size":1041,"imports":["credits.Location.Europe.Sweden","credits.role.technician.Mixed","credits.Track.SideB.Bodied"]},
{"name":"credits.design.cluster.TP Oliva","size":5176,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.design.Design","credits.role.design.Artwork"]},
{"name":"credits.design.cluster.Benoit Paillé","size":449,"imports":["credits.Location.NorthAmerica.Canada East","credits.role.design.Artwork"]},
{"name":"credits.design.cluster.Mason Rezazadeh","size":5176,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.design.Design"]},
{"name":"credits.design.cluster.Jackie Saik","size":5593,"imports":["credits.Location.NorthAmerica.Canada East","credits.role.design.Design"]},
{"name":"credits.thanks.cluster.Dan Bora","size":5534,"imports":["credits.Location.NorthAmerica.United States of America","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Mack Carson","size":9201,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Danny Holten","size":1759,"imports":["credits.role.Thanks.Thank You","credits.Location.Europe.Netherlands"]},
{"name":"credits.thanks.cluster.Noel Fanaeian","size":19975,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Gadget","size":1759,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Heather Gunn","size":1116,"imports":["credits.Location.NorthAmerica.Canada East","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Phillip Isaksen","size":1759,"imports":["credits.Location.Europe.Norway","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Greg Kawchuk","size":6006,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Janet Kawchuk","size":721,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Michael Kawchuk","size":4294,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Steve Levy","size":1314,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Viljar Losnegård","size":1759,"imports":["credits.Location.Europe.Norway","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Hannah Martin","size":1759,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Amie Neigum","size":1314,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Tahlia Rose","size":2220,"imports":["credits.Location.Other.Australia","credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Chris Szott","size":1759,"imports":["credits.Location.NorthAmerica.Canada West","credits.role.Thanks.Thank You"]},
{"name":"credits.thanks.cluster.Mathias Van Eacloo","size":1759,"imports":["credits.Location.Europe.France","credits.role.Thanks.Thank You"]},
{"name":"credits.Location.Other.Australia","size":287,"imports":[]},
{"name":"credits.Location.Other.Occupied Palestinian Territories","size":277,"imports":[]},
{"name":"credits.Location.Europe.Denmark","size":2213,"imports":[]},
{"name":"credits.Location.Europe.France","size":1681,"imports":[]},
{"name":"credits.Location.Europe.Iceland","size":1616,"imports":[]},
{"name":"credits.Location.Europe.Netherlands","size":1681,"imports":[]},
{"name":"credits.Location.Europe.Norway","size":1027,"imports":[]},
{"name":"credits.Location.Europe.Portugal","size":3891,"imports":[]},
{"name":"credits.Location.Europe.Sweden","size":891,"imports":[]},
{"name":"credits.Location.Europe.United Kingdom","size":2893,"imports":[]},
{"name":"credits.Location.NorthAmerica.Canada East","size":933,"imports":[]},
{"name":"credits.Location.NorthAmerica.Canada West","size":5130,"imports":[]},
{"name":"credits.Location.NorthAmerica.United States of America","size":3617,"imports":[]},
{"name":"credits.role.technician.Additional Recording","size":5103,"imports":[]},
{"name":"credits.role.technician.Composition and Production","size":3677,"imports":[]},
{"name":"credits.role.technician.Field Recording","size":5103,"imports":[]},
{"name":"credits.role.technician.Mastered","size":781,"imports":[]},
{"name":"credits.role.technician.Mixed","size":4141,"imports":[]},
{"name":"credits.role.design.Artwork","size":3240,"imports":[]},
{"name":"credits.role.design.Design","size":2732,"imports":[]},
{"name":"credits.role.performer.Cello","size":2165,"imports":[]},
{"name":"credits.role.performer.Clarinet","size":586,"imports":[]},
{"name":"credits.role.performer.Double Bass","size":3331,"imports":[]},
{"name":"credits.role.performer.Extended Piano","size":772,"imports":[]},
{"name":"credits.role.performer.Guitar","size":3322,"imports":[]},
{"name":"credits.role.performer.Harp","size":8833,"imports":[]},
{"name":"credits.role.performer.Heartbeats","size":1732,"imports":[]},
{"name":"credits.role.performer.Horn","size":3623,"imports":[]},
{"name":"credits.role.performer.Joik","size":10066,"imports":[]},
{"name":"credits.role.performer.Marimba","size":4116,"imports":[]},
{"name":"credits.role.performer.Organ","size":1082,"imports":[]},
{"name":"credits.role.performer.Percussion","size":1336,"imports":[]},
{"name":"credits.role.performer.Piano","size":319,"imports":[]},
{"name":"credits.role.performer.Vibraphone","size":10498,"impots":[]},
{"name":"credits.role.performer.Viola","size":2822,"imports":[]},
{"name":"credits.role.performer.Voice","size":9983,"imports":[]},
{"name":"credits.role.Thanks.Thank You","size":330,"imports":[]},
{"name":"credits.Track.SideA.Right Into You","size":2039,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark"]},
{"name":"credits.Track.SideA.Aware","size":1214,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark","credits.Location.Other.Occupied Palestinian Territories"]},
{"name":"credits.Track.SideA.That So (+ Nadia Sirota)","size":3748,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark","credits.Location.NorthAmerica.Canada West"]},
{"name":"credits.Track.SideA.Overhang","size":843,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark"]},
{"name":"credits.Track.SideA.Ebb","size":593,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark"]},
{"name":"credits.Track.SideB.Fast Twitch","size":292,"imports":["credits.Location.NorthAmerica.Canada West","credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark"]},
{"name":"credits.Track.SideB.Bodied","size":595,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark","credits.Location.Europe.Sweden"]},
{"name":"credits.Track.SideB.Lagos","size":594,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark","credits.Location.Europe.Portugal"]},
{"name":"credits.Track.SideB.Honeymoon","size":460,"imports":["credits.Location.Europe.United Kingdom","credits.Location.Europe.Iceland","credits.Location.Europe.Norway","credits.Location.Europe.Denmark","credits.Location.NorthAmerica.Canada West"]}
]

index.html

<!DOCTYPE html>
<meta charset="utf-8">
<link rel = "stylesheet" type = "text/css" href = "style.css"/>
<body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="packages.js"></script>
</body>

packages.js

var diameter = 960,
    radius = diameter / 2,
    innerRadius = radius - 120;
var cluster = d3.cluster()
    .size([360, innerRadius]);
var line = d3.radialLine()
    .curve(d3.curveBundle.beta(0.85))
    .radius(function(d) { return d.y; })
    .angle(function(d) { return d.x / 180 * Math.PI; });
var svg = d3.select("body").append("svg")
    .attr("width", diameter)
    .attr("height", diameter)
  .append("g")
    .attr("transform", "translate(" + radius + "," + radius + ")");
var link = svg.append("g").selectAll(".link"),
    node = svg.append("g").selectAll(".node");
d3.json("https://gist.githubusercontent.com/YungCrunchy/a3ee962aefedef7eafa586646a80c29e/raw/3596e184ddfed113f93d2fb99383d0989347296f/credits.json", function(error, classes) {
  if (error) throw error;
  var root = packageHierarchy(classes)
      .sum(function(d) { return d.size; });
  cluster(root);
  link = link
    .data(packageImports(root.leaves()))
    .enter().append("path")
      .each(function(d) { d.source = d[0], d.target = d[d.length - 1]; })
      .attr("class", "link")
      .attr("d", line);
  node = node
    .data(root.leaves())
    .enter().append("text")
      .attr("class", "node")
      .attr("dy", "0.31em")
      .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + (d.y + 8) + ",0)" + (d.x < 180 ? "" : "rotate(180)"); })
      .attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
      .text(function(d) { return d.data.key; })
      .on("mouseover", mouseovered)
      .on("mouseout", mouseouted);
});
function mouseovered(d) {
  node
      .each(function(n) { n.target = n.source = false; });
  link
      .classed("link--target", function(l) { if (l.target === d) return l.source.source = true; })
      .classed("link--source", function(l) { if (l.source === d) return l.target.target = true; })
    .filter(function(l) { return l.target === d || l.source === d; })
      .raise();
  node
      .classed("node--target", function(n) { return n.target; })
      .classed("node--source", function(n) { return n.source; });
}
function mouseouted(d) {
  link
      .classed("link--target", false)
      .classed("link--source", false);
  node
      .classed("node--target", false)
      .classed("node--source", false);
}
// Lazily construct the package hierarchy from class names.
function packageHierarchy(classes) {
  var map = {};
  function find(name, data) {
    var node = map[name], i;
    if (!node) {
      node = map[name] = data || {name: name, children: []};
      if (name.length) {
        node.parent = find(name.substring(0, i = name.lastIndexOf(".")));
        node.parent.children.push(node);
        node.key = name.substring(i + 1);
      }
    }
    return node;
  }
  classes.forEach(function(d) {
    find(d.name, d);
  });
  return d3.hierarchy(map[""]);
}
// Return a list of imports for the given array of nodes.
function packageImports(nodes) {
  var map = {},
      imports = [];
  // Compute a map from name to node.
  nodes.forEach(function(d) {
    map[d.data.name] = d;
  });
  // For each import, construct a link from the source to target node.
  nodes.forEach(function(d) {
    if (d.data.imports) d.data.imports.forEach(function(i) {
      imports.push(map[d.data.name].path(map[i]));
    });
  });
  return imports;
}

style.css

 
.node {
  font: 300 11px "Helvetica Neue", Helvetica, Arial, sans-serif;
  fill: #2b2b5a;
  opacity: 0.35;
}

.node:hover {
  fill: #2b2b5a;
}

.link {
  stroke: #70709e;
  stroke-opacity: 0.25;
  fill: none;
  pointer-events: none;
  stroke-width: 1px;
}

.node:hover,
.node--source,
.node--target {
  font-weight: 300;
  opacity: 1;
}

.node--source {
  fill: #2b2b5a;
}

.node--target {
  fill: #2b2b5a;
}

.link--source,
.link--target {
  stroke: #DC866A;
  stroke-opacity: 0.9;
  stroke-width: 1px;
}

.link--source {
  stroke: #DC866A;
}

.link--target {
  stroke: #DC866A;
}
html, body {
    height: 100%;
}

html {
    display: table;
    margin: auto;
}

body {
    display: table-cell;
    vertical-align: top;
}