Skip to content

Instantly share code, notes, and snippets.

@jeremiaheb

jeremiaheb/BiomassSunburst.md

Last active February 3, 2016 17:39
Show Gist options
  • Save jeremiaheb/24ce90dbabd86c23fa2b to your computer and use it in GitHub Desktop.
Save jeremiaheb/24ce90dbabd86c23fa2b to your computer and use it in GitHub Desktop.
Download ZIP
Sunburst Biomass Top 75
Raw
README.md

Sunburst Chart of the top 75 spp in FL Keys RVC

Raw
biomass.json
{
"name": "perciformes",
"children": [
{
"name": "Acanthuridae",
"children": [
{
"name": "Acanthurus",
"children": [
{
"name": "bahianus",
"abundance": 14725000,
"biomass": 1120800,
"occurrence": 0.82815
},
{
"name": "chirurgus",
"abundance": 6864100,
"biomass": 1134700,
"occurrence": 0.50017
},
{
"name": "coeruleus",
"abundance": 13802000,
"biomass": 1567600,
"occurrence": 0.79202
}
]
}
]
},
{
"name": "Aulostomidae",
"children": [
{
"name": "Aulostomus",
"children": [
{
"name": "maculatus",
"abundance": 425080,
"biomass": 61049,
"occurrence": 0.14389
}
]
}
]
},
{
"name": "Carangidae",
"children": [
{
"name": "Caranx",
"children": [
{
"name": "bartholomaei",
"abundance": 2457500,
"biomass": 1895600,
"occurrence": 0.051212
},
{
"name": "ruber",
"abundance": 12777000,
"biomass": 880730,
"occurrence": 0.37117
}
]
}
]
},
{
"name": "Chaetodontidae",
"children": [
{
"name": "Chaetodon",
"children": [
{
"name": "capistratus",
"abundance": 4722300,
"biomass": 9128.1,
"occurrence": 0.50266
},
{
"name": "ocellatus",
"abundance": 3159900,
"biomass": 141770,
"occurrence": 0.45888
},
{
"name": "striatus",
"abundance": 469420,
"biomass": 18046,
"occurrence": 0.11195
}
]
}
]
},
{
"name": "Gobiidae",
"children": [
{
"name": "Coryphopterus",
"children": [
{
"name": "dicrus",
"abundance": 281590,
"biomass": 171.1,
"occurrence": 0.07821
},
{
"name": "glaucofraenum",
"abundance": 9602500,
"biomass": 4440.1,
"occurrence": 0.5579
},
{
"name": "personatus",
"abundance": 101500000,
"biomass": 15935,
"occurrence": 0.3657
}
]
},
{
"name": "Elacatinus",
"children": [
{
"name": "oceanops",
"abundance": 1148400,
"biomass": 503.14,
"occurrence": 0.1693
}
]
},
{
"name": "Gnatholepis",
"children": [
{
"name": "thompsoni",
"abundance": 1033500,
"biomass": 669.67,
"occurrence": 0.17772
}
]
}
]
},
{
"name": "Haemulidae",
"children": [
{
"name": "Anisotremus",
"children": [
{
"name": "surinamensis",
"abundance": 103490,
"biomass": 103110,
"occurrence": 0.036349
},
{
"name": "virginicus",
"abundance": 2998000,
"biomass": 875660,
"occurrence": 0.33089
}
]
},
{
"name": "Haemulon",
"children": [
{
"name": "aurolineatum",
"abundance": 46490000,
"biomass": 576040,
"occurrence": 0.14001
},
{
"name": "carbonarium",
"abundance": 751700,
"biomass": 115410,
"occurrence": 0.061755
},
{
"name": "chrysargyreum",
"abundance": 1437900,
"biomass": 46220,
"occurrence": 0.030468
},
{
"name": "flavolineatum",
"abundance": 15514000,
"biomass": 666930,
"occurrence": 0.38724
},
{
"name": "macrostomum",
"abundance": 76919,
"biomass": 21787,
"occurrence": 0.021043
},
{
"name": "parra",
"abundance": 4509600,
"biomass": 1211500,
"occurrence": 0.057246
},
{
"name": "sciurus",
"abundance": 11038000,
"biomass": 1960900,
"occurrence": 0.30514
}
]
}
]
},
{
"name": "Holocentridae",
"children": [
{
"name": "Holocentrus",
"children": [
{
"name": "adscensionis",
"abundance": 287720,
"biomass": 59454,
"occurrence": 0.088384
},
{
"name": "rufus",
"abundance": 200650,
"biomass": 37258,
"occurrence": 0.043758
}
]
}
]
},
{
"name": "Kyphosidae",
"children": [
{
"name": "Kyphosus",
"children": [
{
"name": "sectatrix",
"abundance": 1549700,
"biomass": 936310,
"occurrence": 0.06859
}
]
}
]
},
{
"name": "Labridae",
"children": [
{
"name": "Bodianus",
"children": [
{
"name": "rufus",
"abundance": 1081600,
"biomass": 147730,
"occurrence": 0.24772
}
]
},
{
"name": "Clepticus",
"children": [
{
"name": "parrae",
"abundance": 15316000,
"biomass": 182240,
"occurrence": 0.15925
}
]
},
{
"name": "Halichoeres",
"children": [
{
"name": "bivittatus",
"abundance": 24867000,
"biomass": 113970,
"occurrence": 0.6966
},
{
"name": "garnoti",
"abundance": 17066000,
"biomass": 106700,
"occurrence": 0.75467
},
{
"name": "maculipinna",
"abundance": 9873200,
"biomass": 41219,
"occurrence": 0.56652
},
{
"name": "radiatus",
"abundance": 1311700,
"biomass": 31014,
"occurrence": 0.26992
}
]
},
{
"name": "Lachnolaimus",
"children": [
{
"name": "maximus",
"abundance": 6172400,
"biomass": 2160100,
"occurrence": 0.64246
}
]
},
{
"name": "Thalassoma",
"children": [
{
"name": "bifasciatum",
"abundance": 68466000,
"biomass": 150080,
"occurrence": 0.9257
}
]
}
]
},
{
"name": "Lutjanidae",
"children": [
{
"name": "Lutjanus",
"children": [
{
"name": "analis",
"abundance": 1032700,
"biomass": 1397200,
"occurrence": 0.22238
},
{
"name": "apodus",
"abundance": 2001800,
"biomass": 457020,
"occurrence": 0.11759
},
{
"name": "griseus",
"abundance": 6435900,
"biomass": 1776200,
"occurrence": 0.21608
},
{
"name": "mahogoni",
"abundance": 116960,
"biomass": 33272,
"occurrence": 0.016541
}
]
},
{
"name": "Ocyurus",
"children": [
{
"name": "chrysurus",
"abundance": 18828000,
"biomass": 2999600,
"occurrence": 0.61185
}
]
}
]
},
{
"name": "Monacanthidae",
"children": [
{
"name": "Aluterus",
"children": [
{
"name": "scriptus",
"abundance": 387570,
"biomass": 55533,
"occurrence": 0.094048
}
]
}
]
},
{
"name": "Mullidae",
"children": [
{
"name": "Mulloidichthys",
"children": [
{
"name": "martinicus",
"abundance": 219940,
"biomass": 51715,
"occurrence": 0.024437
}
]
},
{
"name": "Pseudupeneus",
"children": [
{
"name": "maculatus",
"abundance": 2017300,
"biomass": 126230,
"occurrence": 0.28538
}
]
}
]
},
{
"name": "Ostraciidae",
"children": [
{
"name": "Lactophrys",
"children": [
{
"name": "triqueter",
"abundance": 258580,
"biomass": 40510,
"occurrence": 0.11589
}
]
}
]
},
{
"name": "Pomacanthidae",
"children": [
{
"name": "Holacanthus",
"children": [
{
"name": "ciliaris",
"abundance": 1663800,
"biomass": 630980,
"occurrence": 0.37755
},
{
"name": "tricolor",
"abundance": 2868400,
"biomass": 219210,
"occurrence": 0.39116
}
]
},
{
"name": "Pomacanthus",
"children": [
{
"name": "arcuatus",
"abundance": 4211000,
"biomass": 2773700,
"occurrence": 0.58967
},
{
"name": "paru",
"abundance": 959740,
"biomass": 714070,
"occurrence": 0.27668
}
]
}
]
},
{
"name": "Pomacentridae",
"children": [
{
"name": "Abudefduf",
"children": [
{
"name": "saxatilis",
"abundance": 4706000,
"biomass": 160240,
"occurrence": 0.19065
}
]
},
{
"name": "Chromis",
"children": [
{
"name": "cyanea",
"abundance": 11405000,
"biomass": 50847,
"occurrence": 0.37458
},
{
"name": "multilineata",
"abundance": 2912700,
"biomass": 27523,
"occurrence": 0.11215
},
{
"name": "scotti",
"abundance": 2589400,
"biomass": 2819.4,
"occurrence": 0.096457
}
]
},
{
"name": "Microspathodon",
"children": [
{
"name": "chrysurus",
"abundance": 499430,
"biomass": 21103,
"occurrence": 0.086388
}
]
},
{
"name": "Stegastes",
"children": [
{
"name": "adustus",
"abundance": 831090,
"biomass": 7160.8,
"occurrence": 0.12409
},
{
"name": "leucostictus",
"abundance": 899840,
"biomass": 5436.1,
"occurrence": 0.21971
},
{
"name": "partitus",
"abundance": 82492000,
"biomass": 139270,
"occurrence": 0.88548
},
{
"name": "planifrons",
"abundance": 1600700,
"biomass": 14169,
"occurrence": 0.19883
},
{
"name": "variabilis",
"abundance": 3625400,
"biomass": 16833,
"occurrence": 0.49671
}
]
}
]
},
{
"name": "Scaridae",
"children": [
{
"name": "Scarus",
"children": [
{
"name": "coelestinus",
"abundance": 414800,
"biomass": 610650,
"occurrence": 0.079202
},
{
"name": "coeruleus",
"abundance": 1858100,
"biomass": 1349000,
"occurrence": 0.24884
},
{
"name": "guacamaia",
"abundance": 801400,
"biomass": 1328700,
"occurrence": 0.15697
},
{
"name": "iseri",
"abundance": 39752000,
"biomass": 444050,
"occurrence": 0.83378
},
{
"name": "taeniopterus",
"abundance": 2143000,
"biomass": 229220,
"occurrence": 0.23338
},
{
"name": "vetula",
"abundance": 245210,
"biomass": 148660,
"occurrence": 0.068505
}
]
},
{
"name": "Sparisoma",
"children": [
{
"name": "aurofrenatum",
"abundance": 29723000,
"biomass": 990130,
"occurrence": 0.95077
},
{
"name": "chrysopterum",
"abundance": 1298800,
"biomass": 364060,
"occurrence": 0.28755
},
{
"name": "rubripinne",
"abundance": 1445600,
"biomass": 518280,
"occurrence": 0.22942
},
{
"name": "viride",
"abundance": 9826500,
"biomass": 2019500,
"occurrence": 0.65822
}
]
}
]
},
{
"name": "Scombridae",
"children": [
{
"name": "Scomberomorus",
"children": [
{
"name": "regalis",
"abundance": 210930,
"biomass": 210780,
"occurrence": 0.078527
}
]
}
]
},
{
"name": "Serranidae",
"children": [
{
"name": "Cephalopholis",
"children": [
{
"name": "cruentata",
"abundance": 2623000,
"biomass": 204460,
"occurrence": 0.44247
}
]
},
{
"name": "Hypoplectrus",
"children": [
{
"name": "unicolor",
"abundance": 1753700,
"biomass": 15117,
"occurrence": 0.38397
}
]
},
{
"name": "Mycteroperca",
"children": [
{
"name": "bonaci",
"abundance": 206540,
"biomass": 642310,
"occurrence": 0.09011
}
]
},
{
"name": "Serranus",
"children": [
{
"name": "tigrinus",
"abundance": 1462800,
"biomass": 8530,
"occurrence": 0.35105
}
]
}
]
},
{
"name": "Sphyraenidae",
"children": [
{
"name": "Sphyraena",
"children": [
{
"name": "barracuda",
"abundance": 315450,
"biomass": 1182400,
"occurrence": 0.072671
}
]
}
]
},
{
"name": "Tetraodontidae",
"children": [
{
"name": "Canthigaster",
"children": [
{
"name": "rostrata",
"abundance": 3682200,
"biomass": 9328.1,
"occurrence": 0.55068
}
]
}
]
}
]
}
Raw
BiomassSunburst.md

Sunburst Chart of the top 75 spp in FL Keys RVC

Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: auto;
position: relative;
width: 1000px;
}
form {
position: absolute;
right: 10px;
top: 10px;
}
</style>
<form>
<label><input type="radio" name="mode" id="abun" value="abundance" checked="checked" /> Abundance</label>
<label><input type="radio" name="mode" id="bio" value="biomass" /> Biomass</label>
<label style="display:block" id="angle"></label>
</form>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
var width = 1000,
width2 = 500,
height = 1000,
radius = Math.min(width, height) / 2,
color = d3.scale.ordinal()
.range( ["#BAE29D","#ECB1D1","#E5AD6F","#A7DFF1","#82E7CC","#D7BEB1","#C5C5F1","#D2E9CC","#F0A8A1","#E2C86D",
"#D5EB85","#E0CA9B","#DCE2E3","#94E1AD","#A6C1A4","#CACA7F","#81CABF","#D0C3D8","#9CE9E6","#91C0D3"] );
var x = d3.scale.linear()
.range([0, 2 * Math.PI]);
var y = d3.scale.linear()
.range([0, radius]);
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height)
.append("g")
.attr("transform", "translate(" + width/2 + "," + height * .52 + ")");
var svg2 = d3.select("body").append("svg")
.attr("width", width2)
.attr("height", height)
.append("g")
.attr("transform", "translate(" + 0 + "," + 0 + ")");
var partition = d3.layout.partition()
.sort(null)
//.size([2 * Math.PI, radius * radius])
.value(function(d) { return d.abundance; });
var arc = d3.svg.arc()
.startAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x))); })
.endAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx))); })
.innerRadius(function(d) { return Math.max(0, y(d.y)); })
.outerRadius(function(d) { return Math.max(0, y(d.y + d.dy)); });
//var stack = d3.layout.stack()
//.values(function(d) { return d.values; })
// Keep track of selected node
var node;
var currAngle = 0;
d3.json("biomass.json", function(error, root) {
if (error) throw error;
node = root;
var gc = svg.datum(root).selectAll("g")
.data(partition.nodes)
.enter().append("g");
var path = gc.append("path")
//.attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
.attr("d", arc)
.style("stroke", "#fff")
.style("fill", function(d) {
switch(d.depth){
case 3:
endColor = d3.rgb(color(d.parent.parent.name));
return endColor.darker(1);
break;
case 2:
endColor = d3.rgb(color(d.parent.name));
return endColor.darker(.5);
break;
case 1:
endColor = d3.rgb(color(d.name));
return endColor.darker(.25);
break;
case 0:
return color(d.name);
break;
}
})
.on("click", click)
.each(stash);
var text = gc.append("text")
.style("font-size", function(d) { return d.depth ? Math.min(d.dx * 900 * 900/Math.pow((d.depth-node.depth+1), .1),24/Math.pow((d.depth-node.depth+1), .6)) + "px" : (24 + "px") })
.attr("transform", function(d) { return "rotate(" + computeTextRotation(d) + ")"; })
.attr("x", function(d) { return y(d.y); })
.attr("dx", "6") // margin
.attr("dy", ".35em") // vertical-align
.on("click", click)
.text(function(d) { return d.name; });
d3.selectAll("input").on("change", function change() {
var value = this.value === "biomass"
? function() { return 1; }
: function(d) { return d.abundance; };
path
.data(partition.value(value).nodes)
.transition()
.duration(1500)
.attrTween("d", arcTweenData);
text
.data(partition.value(value).nodes)
.transition()
.duration(1500)
.attr("transform", function(d) { return "rotate(" + computeTextRotation(d) + ")"; })
});
function click(d){
if(node == d)
return;
else
node = d;
text.transition()
.duration(500)
.attr("opacity", 0);
path.transition()
.duration(1000)
.attrTween("d", arcTweenZoom(d))
.each("end", function(e, i){
if(e.x >= d.x && e.x < (d.x +d.dx)){
var tx = d3.select(this.parentNode).select("text");
tx.transition()
.duration(450)
.style("font-size", function(d) { return d.depth ? Math.min(d.dx * 900 * 900/Math.pow((d.depth-node.depth+1), .1),24/Math.pow((d.depth-node.depth+1), .6)) + "px" : (24 + "px") })
.attr("x", function(d) { return y(d.y); })
.attr("transform", function(d) { return "rotate(" + computeTextRotation(d) + ")"; })
tx.transition()
.duration(50)
.style("font-size", function(d) { return d.depth ? Math.min(d.dx * 900 * 900/Math.pow((d.depth-node.depth+1), .1),24/Math.pow((d.depth-node.depth+1), .6)) + "px" : (24 + "px") })
.attr("x", function(d) { return y(d.y); })
.attr("transform", function(d) { return "rotate(" + computeTextRotation(d) + ")"; })
.attr("opacity", 1);
}
});
}
});
d3.select(self.frameElement).style("height", height + "px");
// Stash the old values for transition.
function stash(d) {
d.x0 = d.x;
d.dx0 = d.dx;
}
// When switching data: interpolate the arcs in data space.
function arcTweenData(a, i) {
var oi = d3.interpolate({x: a.x0, dx: a.dx0}, a);
function tween(t) {
var b = oi(t);
a.x0 = b.x;
a.dx0 = b.dx;
return arc(b);
}
if (i == 0) {
// If we are on the first arc, adjust the x domain to match the root node
// at the current zoom level. (We only need to do this once.)
var xd = d3.interpolate(x.domain(), [node.x, node.x + node.dx]);
return function(t) {
x.domain(xd(t));
return tween(t);
};
} else {
return tween;
}
}
// When zooming: interpolate the scales.
function arcTweenZoom(d) {
var xd = d3.interpolate(x.domain(), [d.x, d.x + d.dx]),
yd = d3.interpolate(y.domain(), [d.y, 1]),
yr = d3.interpolate(y.range(), [d.y ? 20 : 0, radius]);
return function(d, i) {
return i
? function(t) { return arc(d); }
: function(t) { x.domain(xd(t)); y.domain(yd(t)).range(yr(t)); return arc(d); };
};
}
function computeTextRotation(d) {
//var a = x(d.x + d.dx/2) * 180 / Math.PI - 180;
if(!(d.depth-node.depth)) return (x(d.x + d.dx / 2) * 180) / Math.PI - 180;
return (x(d.x + d.dx / 2) * 180) / Math.PI - 90;
//return a;
}
document.getElementById("abun").checked = true;
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment