Skip to content

Instantly share code, notes, and snippets.

@seshness

seshness/.block

Last active April 5, 2016 07:02
Show Gist options
  • Save seshness/9fd55b31aad13cfdebf132b5715b3d3d to your computer and use it in GitHub Desktop.
Save seshness/9fd55b31aad13cfdebf132b5715b3d3d to your computer and use it in GitHub Desktop.
Download ZIP
Guess the Legend
Raw
.block
license: bsd-3-clause
height: 700
Raw
README.md
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="//d3js.org/d3.geo.projection.v0.min.js" charset="utf-8"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<script src="main.js" charset="utf-8"></script>
</body>
</html>
Raw
main.js
var width = 960,
height = 700;
var svg = d3.select('body').append('svg')
.attr('width', width)
.attr('height', height);
var projection = d3.geo.times()
.scale(200)
.translate([width / 2, height / 2])
.precision(.1);
var path = d3.geo.path().projection(projection);
var graticule = d3.geo.graticule();
svg.append('defs').append('path')
.datum({type: 'Sphere'})
.attr('id', 'sphere')
.attr('d', path);
svg.append('use')
.attr('class', 'stroke')
.attr('xlink:href', '#sphere');
svg.append('use')
.attr('class', 'fill')
.attr('xlink:href', '#sphere');
svg.append('path')
.datum(graticule)
.attr('class', 'graticule')
.attr('d', path);
function d3Fetch(method, filename) {
return new Promise(function(resolve, reject) {
d3[method](filename, function(err, results) {
if (err) { return reject(err); }
return resolve(results);
});
});
}
var metrics = d3Fetch('text', 'metrics.csv').then(function(results) {
return new Map(d3.csv.parseRows(results).map(function(row) {
return [row[0], +row[1]];
}));
}),
mapTopojson = d3Fetch('json', 'sovereignty.topojson');
var tooltip = d3.select('body').append('div')
.attr('class', 'hidden tooltip');
Promise.all([metrics, mapTopojson]).then(function(results) {
var metrics = results[0],
sovereignty = results[1];
var max = -Infinity,
min = Infinity,
sum = 0;
for (var value of metrics.values()) {
max = Math.max(max, value);
min = Math.min(min, value);
sum += value;
}
var avg = sum/metrics.size;
var colourScale = d3.scale.log()
.range(['#fee8c8', '#fdbb84', '#e34a33']) // or use hex values
.domain([min, avg, max]);
var features = topojson.feature(sovereignty, sovereignty.objects.sovereignty).features;
var numberFormatter = d3.format(',');
svg.selectAll('.sovereign-state')
.data(features)
.enter().append('path')
.attr('class', 'stroke sovereign-state')
.attr('d', path)
.attr('fill', function(d) {
return colourScale(metrics.get(d.id));
})
.on('mousemove', function(d) {
var mouse = d3.mouse(svg.node()).map(function(d) {
return parseInt(d);
});
tooltip
.classed('hidden', false)
.attr('style', 'left:' + (mouse[0] + 15) +
'px; top:' + (mouse[1] - 35) + 'px')
.text(d.id + ': ' + numberFormatter(metrics.get(d.id)));
})
.on('mouseout', function() {
tooltip.classed('hidden', true);
});
});
d3.select(self.frameElement).style('height', height + 'px');
Raw
metrics.csv
Afghanistan 1993
Albania 2360
Algeria 878
Andorra 121
Angola 107
Antigua and Barb. 10
Argentina 22065
Armenia 1805
Australia 106719
Austria 21145
Azerbaijan 291
Bahamas 309
Bahrain 697
Bangladesh 892
Barbados 268
Belarus 770
Belgium 28100
Belize 546
Benin 28
Bhutan 230
Bolivia 774
Bosnia and Herz. 1178
Botswana 95
Brazil 6345
Brunei 814
Bulgaria 8522
Burkina Faso 33
Burundi 35
Cambodia 1658
Cameroon 92
Canada 201166
Cape Verde 80
Central African Rep. 15
Chad 58
Chile 12444
China 26784
Taiwan 7630
Colombia 4610
Comoros 17
Dem. Rep. Congo 69
Congo 16
Costa Rica 2740
Croatia 13374
Cuba 2349
Cyprus 748
Czech Rep. 2368
Denmark 42788
Djibouti 34
Dominica 71
Dominican Rep. 911
Timor-Leste 95
Ecuador 2855
Egypt 2670
El Salvador 1321
Eq. Guinea 1
Eritrea 184
Estonia 7050
Ethiopia 577
Micronesia 18
Fiji 290
Finland 9168
France 69300
Gabon 21
Gambia 30
Georgia 1672
Germany 29020
Ghana 403
Greece 15889
Grenada 10
Guatemala 1485
Guinea 14
Guinea-Bissau 16
Guyana 314
Haiti 826
Honduras 536
Hungary 11058
Iceland 13076
India 48560
Indonesia 11898
Iran 7210
Iraq 1703
Ireland 73226
Israel 20542
Italy 40029
Côte d'Ivoire 21
Jamaica 1244
Japan 66672
Jordan 1014
Kazakhstan 742
Kenya 2999
Dem. Rep. Korea 8338
Korea 20430
Kosovo 304
Kuwait 1136
Kyrgyzstan 193
Lao PDR 557
Latvia 5300
Lebanon 2841
Lesotho 58
Liberia 49
Libya 355
Liechtenstein 147
Lithuania 8958
Luxembourg 2505
Macedonia 815
Madagascar 194
Malawi 99
Malaysia 6318
Maldives 151
Mali 79
Malta 1025
Marshall Is. 20
Mauritania 56
Mauritius 273
Mexico 47646
Moldova 519
Monaco 117
Mongolia 852
Montenegro 221
Morocco 1704
Mozambique 81
Myanmar 474
Namibia 179
Nauru 29
Nepal 2622
Netherlands 5413
New Zealand 64061
Nicaragua 948
Niger 44
Nigeria 702
Norway 12666
Oman 707
Pakistan 5838
Palau 51
Panama 1466
Papua New Guinea 98
Paraguay 1177
Peru 6277
Philippines 50308
Poland 6887
Portugal 11837
Qatar 897
Romania 27830
Russia 17791
Rwanda 174
W. Sahara 3
St. Kitts and Nevis 23
Saint Lucia 12
St. Vin. and Gren. 12
Samoa 77
San Marino 19
São Tomé and Principe 6
Saudi Arabia 2380
Senegal 141
Serbia 3441
Seychelles 21
Sierra Leone 84
Singapore 40781
Slovakia 4882
Slovenia 1601
Solomon Is. 35
Somalia 433
Somaliland 34
South Africa 18841
S. Sudan 250
Spain 6770
Sri Lanka 1258
Sudan 187
Suriname 82
Swaziland 45
Sweden 94037
Switzerland 7481
Syria 2444
Tajikistan 273
Tanzania 278
Thailand 8871
Togo 22
Tonga 91
Trinidad and Tobago 628
Tunisia 545
Turkey 7407
Turkmenistan 106
Tuvalu 102
Uganda 236
Ukraine 5863
United Arab Emirates 1095
United Kingdom 118365
United States 6125
Uruguay 1645
Uzbekistan 181
Vanuatu 46
Vatican 10
Venezuela 8693
Vietnam 4789
Yemen 360
Zambia 139
Zimbabwe 258
Display the source blob
Display the rendered blob
Raw
sovereignty.topojson
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Raw
styles.css
View raw

(Sorry about that, but we can’t show files that are this big right now.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment