Skip to content

Instantly share code, notes, and snippets.

@mhawksey
Forked from mbostock/.block
Created December 21, 2011 12:14
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save mhawksey/1505811 to your computer and use it in GitHub Desktop.
Dependency Chord Diagram (D3)
[
{"name":"HE - Education","size":225,"imports":["University of Nottingham","Loughborough University","York St John University","Leeds Metropolitan University","University of Leicester","Manchester Metropolitan University","University of Bolton","Staffordshire University","University of Westminster","University of Exeter","The Open University","Aston University","Southampton Solent University","University of Bath","University of Glamorgan","University of Dundee","Plymouth University ","University of Derby","University of Wolverhampton"]},
{"name":"FE - Engineering","size":7,"imports":["University of Sheffield","University of York","Leeds Metropolitan University"]},
{"name":"HE - Engineering","size":1077,"imports":["University of Sheffield","University of Wales","University of Hertfordshire","University of Portsmouth","University of Liverpool","University of Manchester","Loughborough University","University of Nottingham","University of Birmingham","Engineering Subject Centre","University of Cambridge","University of Leeds","University of York","Leeds Metropolitan University","University of Bath"]},
{"name":"HE - Mathematical and Computer Sciences","size":766,"imports":["University of Sheffield","Subject Centre for Information and Computer Sciences","Staffordshire University","University of Nottingham","University of Exeter","Leeds Metropolitan University","University of Derby","University of Wolverhampton"]},
{"name":"FE - Education / Training / Teaching","size":76,"imports":["Leeds Metropolitan University","University of Leicester","University of Bolton"]},
{"name":"HE - Social studies","size":133,"imports":["University of Leicester","University of Bolton","University of Nottingham","Manchester Metropolitan University","Aston University","University of Ulster","Keele University","Coventry University","University of Portsmouth","Leeds Metropolitan University","Oxford University","Plymouth University ","University of Wolverhampton"]},
{"name":"HE - Technologies","size":15,"imports":["University of Leicester","University of Westminster","University of York","University of Bath"]},
{"name":"HE - Biological Sciences","size":144,"imports":["University of Leeds","Oxford University","The Open University","University of Glasgow","De Montfort University","University of Bath","University of Manchester","University of Nottingham","University of Gloucestershire","Leeds Metropolitan University","University of Derby","UK Centre for Bioscience"]},
{"name":"HE - Subjects allied to Medicine","size":55,"imports":["Bournemouth University","Oxford University","Brunel University","University of Bedfordshire","University of Nottingham","Leeds Metropolitan University","University of Leicester","Sheffield Hallam University","De Montfort University","University of Derby","University of Wolverhampton"]},
{"name":"HE - Veterinary Sciences, Agriculture and related subjects","size":839,"imports":["Oxford University","University of Nottingham","Newcastle University"]},
{"name":"HE - Medicine and Dentistry","size":70,"imports":["Oxford University","Newcastle University","University of Aberdeen","University of Southampton","Queen’s University Belfast","University of London","University of Nottingham","Leeds Metropolitan University"]},
{"name":"HE - Creative Arts and Design","size":4067,"imports":["University of the Arts London","Staffordshire University","University of Cumbria","University College Falmouth","Leeds Metropolitan University","Oxford University","University of Derby","University of Wolverhampton"]},
{"name":"HE - Mass Communications and Documentation","size":18,"imports":["University of the Arts London","University of Birmingham"]},
{"name":"HE - Physical Sciences","size":384,"imports":["The Open University","University of Leicester","University of Wales","University of Reading","Keele University","Staffordshire University","University of Nottingham","University of Southampton","University of Exeter","Loughborough University","Leeds Metropolitan University","University of Lincoln","UK Physical Sciences Centre","University of Hull","University of Liverpool","Oxford University","University of Derby","University of Wolverhampton"]},
{"name":"FE - Information Technology & Information","size":3,"imports":["University of Edinburgh","University of Westminster","University of York"]},
{"name":"HE - Business and Administrative studies","size":133,"imports":["University of Nottingham","University of Exeter","Leeds Metropolitan University","Coventry University","Plymouth University ","University of Liverpool","University of Derby","University of Wolverhampton"]},
{"name":"HE - European Languages, Literature and related subjects","size":53,"imports":["University of Nottingham","Oxford University"]},
{"name":"HE - Law","size":12,"imports":["University of Nottingham","University of Exeter","Staffordshire University","University of Strathclyde","University of Derby"]},
{"name":"HE - Eastern, Asiatic, African, American and Australasian Languages, Literature and related subjects","size":6,"imports":["University of Nottingham"]},
{"name":"HE - Historical and Philosophical studies","size":139,"imports":["University of Nottingham","University of Exeter","Oxford University"]},
{"name":"HE - Architecture, Building and Planning","size":51,"imports":["University of Nottingham","Leeds Metropolitan University"]},
{"name":"FE - Humanities (History / Archaeology / Religious Studies / Philosophy)","size":1,"imports":["University of Exeter"]},
{"name":"FE - Catering / Food / Leisure Services / Tourism","size":21,"imports":["Leeds Metropolitan University"]},
{"name":"FE - Sciences & Mathematics","size":3,"imports":["Leeds Metropolitan University"]},
{"name":"FE - Sales Marketing & Retailing","size":4,"imports":["Leeds Metropolitan University"]},
{"name":"FE - Politics / Economics / Law / Social Sciences","size":4,"imports":["Leeds Metropolitan University"]},
{"name":"FE - Construction & Property (Built Environment)","size":49,"imports":["Leeds Metropolitan University"]},
{"name":"FE - Agriculture Horticulture & Animal Care","size":1,"imports":["University of Leicester"]},
{"name":"FE - Business / Management / Office Studies","size":7,"imports":["University of Bath"]}
]

A chord diagram in D3.js, showing dependencies between classes in a software class hierarchy. Dependencies are grouped according to the source and target packages. Although this diagram does not show class-level detail visible with hierarchical edge bundling, it better reveals the total number of imports between and within packages. Note, for example, the circular dependency between vis.data and vis.events. Colors by ColorBrewer.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Chord Diagram</title>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.22.1"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.layout.js?1.22.1"></script>
<style type="text/css">
body {
font: 10px sans-serif;
}
path.chord {
fill-opacity: .67;
}
</style>
</head>
<body>
<script type="text/javascript">
var r1 = 960 / 2,
r0 = r1 - 120;
var fill = d3.scale.category20c();
var chord = d3.layout.chord()
.padding(.04)
.sortSubgroups(d3.descending)
.sortChords(d3.descending);
var arc = d3.svg.arc()
.innerRadius(r0)
.outerRadius(r0 + 20);
var svg = d3.select("body").append("svg:svg")
.attr("width", r1 * 2)
.attr("height", r1 * 2)
.append("svg:g")
.attr("transform", "translate(" + r1 + "," + r1 + ")");
d3.json("readme.json", function(imports) {
var indexByName = {},
nameByIndex = {},
matrix = [],
n = 0;
// Returns the Flare package name for the given class name.
function name(name) {
return name;
}
// Compute a unique index for each package name.
imports.forEach(function(d) {
d = name(d.name);
if (!(d in indexByName)) {
nameByIndex[n] = d;
indexByName[d] = n++;
}
});
// Construct a square matrix counting package imports.
imports.forEach(function(d) {
var source = indexByName[name(d.name)],
row = matrix[source];
if (!row) {
row = matrix[source] = [];
for (var i = -1; ++i < n;) row[i] = 0;
}
d.imports.forEach(function(d) { row[indexByName[name(d)]]++; });
});
chord.matrix(matrix);
var g = svg.selectAll("g.group")
.data(chord.groups)
.enter().append("svg:g")
.attr("class", "group");
g.append("svg:path")
.style("fill", function(d) { return fill(d.index); })
.style("stroke", function(d) { return fill(d.index); })
.attr("d", arc);
g.append("svg:text")
.each(function(d) { d.angle = (d.startAngle + d.endAngle) / 2; })
.attr("dy", ".35em")
.attr("text-anchor", function(d) { return d.angle > Math.PI ? "end" : null; })
.attr("transform", function(d) {
return "rotate(" + (d.angle * 180 / Math.PI - 90) + ")"
+ "translate(" + (r0 + 26) + ")"
+ (d.angle > Math.PI ? "rotate(180)" : "");
})
.text(function(d) { return nameByIndex[d.index]; });
svg.selectAll("path.chord")
.data(chord.chords)
.enter().append("svg:path")
.attr("class", "chord")
.style("stroke", function(d) { return d3.rgb(fill(d.source.index)).darker(); })
.style("fill", function(d) { return fill(d.source.index); })
.attr("d", d3.svg.chord().radius(r0));
});
d3.select(self.frameElement).style("height", "960px");
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment