// Generated by CoffeeScript 1.10.0 (function() { var by_height, by_value, height, svg, width, indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }; svg = d3.select('body').append('svg'); width = d3.select('svg').node().getBoundingClientRect().width - 50; height = d3.select('svg').node().getBoundingClientRect().height; by_value = function(a, b) { if (a.value < b.value) { return -1; } else if (a.value > b.value) { return 1; } else { return 0; } }; by_height = function(a, b) { if (a.height < b.height) { return -1; } else if (a.height > b.height) { return 1; } else { return 0; } }; d3.csv('links.csv', function(error, data) { var depth_range_x, depth_range_y, depth_ranges, depth_ranges_data, depth_ranges_group, enter_depth_ranges, index, line, root, scale, tick_group, ticks, ticks_data, vis, vis_data; data.forEach(function(d) { if (d.parent === "") { return d.parent = "root"; } }); data.push({ name: "root", parent: "" }); root = (d3.stratify().id(function(d) { return d.name; }).parentId(function(d) { return d.parent; }))(data); root.count(); /* First chart */ scale = d3.scalePow().exponent(0.25).range([height / 2, 2]).domain(d3.extent(root.children, function(d) { return d.value; })); line = d3.line().x(function(d, i) { return i * width / root.children.length; }).y(function(d) { return scale(d.value); }); vis_data = root.children.map(function(child) { return { id: child.id, value: child.value, height: child.height }; }).sort(by_value); vis = svg.append('g').attrs({ transform: 'translate(40,0)' }); ticks_data = [10, 50, 100, 200, 300, 500, 1000, 2000, 3000, 4000, 5000, 6000, 7000]; tick_group = vis.append('g'); ticks = tick_group.selectAll('.tick_line').data(ticks_data); ticks.enter().append('line').attrs({ "class": 'tick_line', x1: 0, x2: width, y1: function(d) { return scale(d); }, y2: function(d) { return scale(d); } }); vis.append('g').call(d3.axisLeft(scale).tickValues(ticks_data)).append('text').attrs({ fill: '#000', transform: "rotate(-90)", y: 6, dy: '0.71em', 'text-anchor': 'end' }).text("Leaf count"); vis.append('path').datum(vis_data).attrs({ "class": 'line', d: line }); /* Second chart */ depth_ranges_data = []; index = []; vis_data.sort(by_height).forEach(function(d, i) { var ref; if (ref = d.height, indexOf.call(index, ref) >= 0) { return depth_ranges_data[Object.keys(index).length - 1].end_index = i; } else { index.push(d.height); return depth_ranges_data.push({ level: d.height, start_index: i, end_index: i + 1 }); } }); depth_range_x = d3.scaleLinear().domain(d3.extent(depth_ranges_data, function(d) { return d.end_index - d.start_index; })).range([0, width]); depth_range_y = d3.scaleOrdinal().domain(depth_ranges_data.map(function(d) { return d.level; }).reverse()).range([200, 180, 160, 140, 120, 100, 80, 60, 40, 20, 0]); depth_ranges_group = vis.append('g').attrs({ transform: "translate(0, " + (height - height / 4) + ")" }); depth_ranges_group.append('g').attrs({ transform: "translate(0, " + (depth_ranges_data.length * 17) + ")" }).call(d3.axisBottom(depth_range_x)).append('text').attrs({ transform: "translate(" + width + ", -2)", fill: '#000', 'text-anchor': 'end' }).text("Tree count"); depth_ranges_group.append('g').attrs({ transform: "translate(0, " + (-64) + ")" }).call(d3.axisLeft(depth_range_y)).append('text').attrs({ fill: '#000', transform: function(d, i) { return "rotate(-90)"; }, y: 6, dy: '0.71em', 'text-anchor': 'start' }).text("Depth levels"); depth_ranges = depth_ranges_group.selectAll('.range').data(depth_ranges_data); enter_depth_ranges = depth_ranges.enter().append('g').attrs({ transform: function(d, i) { return "translate(0, " + (i * 20 - 10) + ")"; } }); enter_depth_ranges.append('rect').attrs({ width: function(d) { return depth_range_x(d.end_index - d.start_index); }, height: 13 }); return enter_depth_ranges.append('text').attrs({ "class": 'bar_label', fill: function(d) { if (d.end_index - d.start_index < 25) { return '#303030'; } else { return '#FFF'; } }, transform: function(d, i) { if (d.end_index - d.start_index < 25) { return "translate(" + (depth_range_x(d.end_index - d.start_index) + 15) + ", 10)"; } else { return "translate(" + (depth_range_x(d.end_index - d.start_index) - 5) + ", 10)"; } } }).text(function(d) { return d.end_index - d.start_index; }); }); }).call(this);