// Generated by CoffeeScript 1.10.0 (function() { var color, contents, graticule, height, lod, path, projection, radius, svg, width, zoom, zoomable_layer; svg = d3.select('svg'); width = svg.node().getBoundingClientRect().width; height = svg.node().getBoundingClientRect().height; zoomable_layer = svg.append('g'); zoom = d3.zoom().scaleExtent([-Infinity, Infinity]).on('zoom', function() { zoomable_layer.attrs({ transform: d3.event.transform }); zoomable_layer.selectAll('.label > text').attrs({ transform: "scale(" + (1 / d3.event.transform.k) + ")" }); return lod(d3.event.transform.k); }); svg.call(zoom); projection = d3.geoWinkel3().rotate([0, 0]).center([0, 0]).scale((width - 3) / (2 * Math.PI)).translate([width / 2, height / 2]); path = d3.geoPath(projection); graticule = d3.geoGraticule(); radius = d3.scaleSqrt().range([0, 50]); color = d3.scaleOrdinal(d3.schemeCategory10).domain(['North America', 'Africa', 'South America', 'Asia', 'Europe', 'Oceania']); zoomable_layer.append('path').datum(graticule.outline()).attrs({ "class": 'sphere_fill', d: path }); contents = zoomable_layer.append('g'); zoomable_layer.append('path').datum(graticule).attrs({ "class": 'graticule', d: path }); zoomable_layer.append('path').datum(graticule.outline()).attrs({ "class": 'sphere_stroke', d: path }); d3.json('ne_50m_admin_0_countries.topo.json', function(geo_data) { var countries, countries_data, en_countries, en_labels, labels, labels_data; countries_data = topojson.feature(geo_data, geo_data.objects.countries).features; labels_data = []; countries_data.forEach(function(d) { var subpolys; if (d.geometry.type === 'Polygon') { d.area = d3.geoArea(d); d.main = d; return labels_data.push(d); } else if (d.geometry.type === 'MultiPolygon') { subpolys = []; d.geometry.coordinates.forEach(function(p) { var sp; sp = { coordinates: p, properties: d.properties, type: 'Polygon' }; sp.area = d3.geoArea(sp); return subpolys.push(sp); }); d.main = subpolys.reduce((function(a, b) { if (a.area > b.area) { return a; } else { return b; } }), subpolys[0]); return labels_data = labels_data.concat(subpolys); } }); countries = contents.selectAll('.country').data(countries_data); en_countries = countries.enter().append('path').attrs({ "class": 'country', d: path }); labels = contents.selectAll('.label').data(labels_data); en_labels = labels.enter().append('g').attrs({ "class": 'label', transform: function(d) { var ref, x, y; ref = projection(d3.geoCentroid(d)), x = ref[0], y = ref[1]; return "translate(" + x + "," + y + ")"; } }); en_labels.classed('no_iso_code', function(d) { return d.properties.iso_a2 === '-99'; }); en_labels.append('text').text(function(d) { return d.properties.name_long; }).attrs({ dy: '0.35em' }); lod(1); return d3.csv('population.csv', function(data) { var bubbles, en_bubbles, index, population_data; index = {}; data.forEach(function(d) { return index[d['Country Code']] = d; }); population_data = []; countries_data.forEach(function(d) { if (d.properties.iso_a3 in index) { return population_data.push({ country: d, value: +index[d.properties.iso_a3]['2016'] }); } }); radius.domain([ 0, d3.max(population_data, function(d) { return d.value; }) ]); population_data.sort(function(a, b) { return d3.descending(a.value, b.value); }); bubbles = contents.selectAll('.bubble').data(population_data); en_bubbles = bubbles.enter().append('circle').attrs({ "class": 'bubble', fill: function(d) { return color(d.country.properties.continent); }, r: function(d) { return radius(d.value); }, transform: function(d) { var ref, x, y; ref = projection(d3.geoCentroid(d.country.main)), x = ref[0], y = ref[1]; return "translate(" + x + "," + y + ")"; } }); return en_bubbles.append('title').text(function(d) { return d.country.properties.name_long + "\nPopulation: " + (d3.format(',')(d.value)); }); }); }); lod = function(z) { return zoomable_layer.selectAll('.label').classed('hidden', function(d) { return d.area < Math.pow(0.2 / z, 2); }); }; }).call(this);