Skip to content

Instantly share code, notes, and snippets.

@melalj

melalj/.block

Last active December 21, 2016 18:25
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save melalj/145ef67aa04a6713bc1d026eed46c59e to your computer and use it in GitHub Desktop.
Save melalj/145ef67aa04a6713bc1d026eed46c59e to your computer and use it in GitHub Desktop.
Download ZIP
MapTable: Heatmap visualization (SVG + Canvas) exportable
Raw
.block
license: MIT
height: 900
scrolling: yes
Raw
basic.csv
country region city longitude latitude traf
Angola Africa Luanda 13.23 -8.85 20000000
Argentina Latin America Buenos Aires -58.42 -34.57 40000000
Argentina Latin America Córdoba -64.1858 -31.4036 60000000
Argentina Latin America Neuquén -68.1333 -38.9333 80000000
Australia Asia-Pacific Perth 115.95 -31.93 20000000
Australia Asia-Pacific Sydney 151.17999 -33.95 20000000
Australia Asia-Pacific Sydney 151.17999 -33.95 10000000
Austria Europe Klagenfurt 14.33 46.65 80000000
Austria Europe Vienna 16.37 48.2 40000000
Bahrain Europe Manama 50.65 26.27 40000000
Bangladesh Asia-Pacific Dhaka 90.38 23.77 70000000
Bolivia Latin America La Paz -68.15 -16.5 30000000
Brazil Latin America São Paulo -46.65 -23.62 80000000
Bulgaria Europe Sofia 23.38 42.65 70000000
Bulgaria Europe Sofia 23.38 42.65 70000000
Bulgaria Europe Sofia 23.38 42.65 20000000
Canada North America Calgary -114.0669 51.0544 20000000
Canada North America Halifax -63.61 44.67 60000000
Canada North America Montreal -73.75 45.47 60000000
Canada North America Ottawa -75.72 45.4 1000000
Canada North America Toronto -79.4 43.67 20000000
Canada North America Winnipeg -97.15 49.8833 1000000
Canada North America Winnipeg -97.15 49.8833 50000000
China Asia-Pacific Hong Kong 114.18 22.33 70000000
Costa Rica Latin America San Jose -84.083 9.93504 70000000
Czech Republic Europe Prague 14.43 50.08 10000000
Dominica Latin America Roseau -61.4 15.3 50000000
Egypt Africa Cairo 31.4 30.13 30000000
Estonia Europe Tallinn 24.8 59.35 1000000
Finland Europe Tampere 23.58 61.42 50000000
France Europe Lyon 4.95 45.72 80000000
France Europe Paris 2.33 48.8 60000000
France Europe Paris 2.33 48.8 70000000
France Europe Paris 2.33 48.8 70000000
Gambia Africa Serrekunda -16.6666 13.43637 10000000
Germany Europe Berlin 13.52 52.38 70000000
Germany Europe Berlin 13.52 52.38 70000000
Germany Europe Düsseldorf 6.76 51.28 20000000
Germany Europe Frankfurt 8.68 50.12 1000000
Germany Europe Frankfurt 8.68 50.12 50000000
Germany Europe Hamburg 10.03 53.55 70000000
Germany Europe Munich 11.7 48.13 70000000
Grenada Latin America St. Georges -61.74995 12.05363 40000000
Haiti Latin America Port au Prince -72.3 18.57 40000000
India Asia-Pacific Mumbai 72.8 19 70000000
Indonesia Asia-Pacific Jakarta 106.82944 -6.17444 30000000
Indonesia Asia-Pacific Jakarta 106.82944 -6.17444 20000000
Indonesia Asia-Pacific Jakarta 106.82944 -6.17444 10000000
Ireland Europe Dublin -6.25 53.33 80000000
Italy Europe Torino 7.65 45.22 70000000
Jamaica Latin America Kingston -76.78 17.93 20000000
Japan Asia-Pacific Tokyo 139.78 35.55 60000000
Japan Asia-Pacific Tokyo 139.78 35.55 70000000
Kenya Africa Nairobi 36.82 -1.32 20000000
Korea Asia-Pacific Seoul 126.93 37.5 20000000
Lebanon Europe Beirut 35.48 33.82 60000000
Malawi Africa Blantyre 35 -15.78333 20000000
Malaysia Asia-Pacific Kuala Lumpur 101.7 3.13 40000000
Mexico North America Mexico DF -99.13408 19.41894 1000000
Mozambique Africa Maputo 32.57 -25.92 10000000
Namibia Africa Windhoek 17.08514 -22.56429 10000000
Nepal Asia-Pacific Kathmandu 85.37 27.7 50000000
Netherlands Europe Amsterdam 4.77 52.3 80000000
Netherlands Europe Amsterdam 4.77 52.3 40000000
New Zealand Asia-Pacific Auckland 174.8 -37.02 1000000
New Zealand Asia-Pacific Wellington 174.8 -41.33 20000000
Nigeria Africa Lagos 3.35 6.55 20000000
Philippines Asia-Pacific Manila 120.95 14.58 20000000
Poland Europe Warsaw 21 52.23 30000000
Puerto Rico North America San Juan -66.11 18.47 20000000
Rwanda Africa Kigali 30.12 -1.97 70000000
Singapore Asia-Pacific Singapore 103.98 1.37 1000000
Singapore Asia-Pacific Singapore 103.98 1.37 50000000
Singapore Asia-Pacific Singapore 103.98 1.37 60000000
South Africa Africa Cape Town 18.6 -33.98 10000000
South Africa Africa Cape Town 18.6 -33.98 1000000
South Africa Africa Durban 30.95 -29.97 40000000
South Africa Africa Durban 30.95 -29.97 30000000
South Africa Africa Johannesburg 28.23 -26.13 1000000
Sudan Africa Khartoum 32.58693 15.60214 60000000
Sweden Europe Stockholm 18.05 59.33 30000000
Switzerland Europe Zurich 8.53 47.48 60000000
Tanzania Africa Arusha 36.62 -3.33 30000000
Tanzania Africa Dar es Salaam 39.2 -6.87 70000000
Trinidad and Tobago Latin America Barataria -61.46287 10.64688 50000000
Tunisia Africa Enfidha 10.37935 36.1344 10000000
Tunisia Africa Tunis 10.16596 36.81881 80000000
Turkey Europe Istanbul 28.82 40.97 80000000
Ukraine Europe Kiev 30.45 50.4 70000000
United Arab Emirates Europe Dubai 55.33 25.25 20000000
United Kingdom Europe Leeds -1.55 53.8 10000000
United Kingdom Europe London -0.45 51.48 1000000
United Kingdom Europe London -0.45 51.48 50000000
United Kingdom Europe Manchester -2.27 53.35 30000000
United States North America Ashburn -77.46 39.02 20000000
United States North America Atlanta -84.4 33.86 10000000
United States North America Boston -71.03 42.37 80000000
United States North America Chicago -87.65 41.85 50000000
United States North America Indianapolis -86.10947 39.77511 20000000
United States North America Jacksonville -81.65565 30.33218 40000000
United States North America Los Angeles -118.25 33.97 60000000
United States North America Los Angeles -118.25 33.97 70000000
United States North America Los Angeles -118.25 33.97 70000000
United States North America Miami -80.29 25.83 50000000
United States North America New York -74 40.75 40000000
United States North America New York -74 40.75 30000000
United States North America New York -74 40.75 20000000
United States North America New York -74 40.75 10000000
United States North America Palo Alto -122.15 37.44 50000000
United States North America Portland -122.68 45.52 20000000
United States North America Reno -119.76983 39.46926 1000000
United States North America San Diego -117.16 32.72 60000000
United States North America San Francisco -122.43 37.78 70000000
United States North America Seattle -122.33 47.61 40000000
United States North America Seattle -122.33 47.61 30000000
Vanuatu Asia-Pacific Port Vila 168.32 -17.75 30000000
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://packet-clearing-house.github.io/maptable/maptable.css">
<title>MapTable: Heatmap visualization (SVG + Canvas) exportable</title>
</head>
<body>
<div id="vizContainer" class='container'></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.16/d3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.20/topojson.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>
<script src="https://packet-clearing-house.github.io/maptable/maptable.min.js"></script>
<script>
var viz = d3.maptable('#vizContainer')
.csv('basic.csv')
.map({
exportSvgClient: true,
path: 'ne_110m_admin_0_countries.json',
filterCountries: function (country) {
return country.id !== 'AQ';
},
heatmap: {
weightByAttribute: function(d) {
return parseInt(d.traf, 10);
},
weightByAttributeScale: 'log',
circles: {
color: '#0000FF',
blur: 6.0,
},
borders: {
opacity: 0.2,
},
},
markers: {
attr: {
fill: "yellow",
stroke: "#d9d9d9",
"stroke-width": 0.5,
r: {
min: "minValue",
max: "maxValue",
transform: function(v) {
return 3 * Math.sqrt(v);
},
rollup: function(values) {
return values.length;
},
},
}
}
})
.render();
</script>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
ne_110m_admin_0_countries.json
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment