Created
December 2, 2015 17:48
-
-
Save tyramoss/f63b3e857770695a1480 to your computer and use it in GitHub Desktop.
Module 4
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Map made with d3.js</title> | |
<script type="text/javascript" src="http://d3js.org/d3.v3.js"></script> | |
<style type="text/css"> | |
body { | |
background-color: #eeeeee; | |
font-family: Helvetica, Arial, sans-serif; | |
} | |
h1 | |
{font-family: sans-serif; | |
font-weight: 100; | |
font-size: 20px; | |
color: #92CC50; | |
padding-left: 50px; | |
} | |
p | |
{font-family: sans-serif; | |
font-weight: 100; | |
font-size: 11px; | |
padding-left: 50px; | |
line-height: 15px; | |
} | |
a:link { | |
text-decoration: none; | |
color: #92CC50; | |
} | |
a:hover { | |
text-decoration: underline; | |
} | |
a:visited { | |
color: #92CC50; | |
} | |
a:active { | |
color: #92CC50; | |
} | |
text | |
{font-family: sans-serif; | |
font-size: 9px; | |
} | |
svg { | |
background-color: white; | |
} | |
#container { | |
width: 600px; | |
margin-left: auto; | |
margin-right: auto; | |
margin-top: 25px; | |
padding: 25px; | |
background-color: white; | |
box-shadow: 1px 1px 1px 1px #ccc; | |
} | |
path { | |
stroke: white; | |
stroke-width: 0.5; | |
fill: #F4E7D3; | |
} | |
</style> | |
</head> | |
<body> | |
<div id="container"> | |
<h1>Swift nests in the city of Utrecht</h1> | |
<p>This map shows the amount of Swift nests counted in 2014 in relation to the amount of urbanisation. </p><p>Dark neighbourhoods are highly urbanized, light neighbourhoods are less urbanized.</p> | |
<p>Bron: <a href="https://opendata.utrecht.nl/dataset/resultaten-gierzwaluwinventarisatie-2014">Gemeente Utrecht</a>, 2015</p> | |
</div> | |
<script type="text/javascript"> | |
//Width and height | |
var w = 600; | |
var h = 500; | |
//Define map projection | |
var projection = d3.geo.mercator() | |
.center([ 5, 53]) | |
.translate([ w/2-180, -2900 ]) | |
.scale([ 120000 ]); | |
//Define path generator | |
var path = d3.geo.path() | |
.projection(projection); | |
//Create SVG | |
var svg = d3.select("#container") | |
.append("svg") | |
.attr("width", w) | |
.attr("height", h); | |
//Load in GeoJSON data | |
d3.json("7.json", function(json) { | |
//Bind data and create one path per GeoJSON feature | |
svg.selectAll("path") | |
.data(json.features) | |
.enter() | |
.append("path") | |
.attr("d", path) | |
// .style("fill", "grey") | |
.style("fill", function(d) { | |
//Get data value | |
//var value = d.properties.STED; | |
if (d.properties.STED <= 1) {return "#C1A080"} | |
if (d.properties.STED <= 2) {return "#D6BD9F"} | |
if (d.properties.STED <= 3) {return "#E0CFB8"} | |
if (d.properties.STED <= 4) {return "#F4E7D3"} | |
if (d.properties.STED <= 5) {return "#F9F4ED"} | |
else { | |
//If value is undefined… | |
return "#ccc"; | |
} | |
}); | |
//Load in zwaluw data | |
d3.csv("zwaluw.csv", function(data) { | |
//Create a circle for each nest | |
svg.selectAll("circle") | |
.data(data) | |
.enter() | |
.append("circle") | |
.attr("cx", function(d) { | |
//[0] returns the first coordinate (x) of the projected value | |
return projection([d.lon, d.lat])[0]; | |
}) | |
.attr("cy", function(d) { | |
//[1] returns the second coordinate (y) of the projected value | |
return projection([d.lon, d.lat])[1]; | |
}) | |
.attr("r", function(d) { | |
//Use Math.sqrt to scale by area (not radius) | |
return (d.aantal*2) | |
// return Math.sqrt(+d.aantal / w * 10); | |
}) | |
//.attr("r", 5) | |
.style("fill", "green") | |
.style("opacity", 0.5); | |
svg.selectAll("circle") | |
.append("title") | |
.text(function(d) { | |
return d.aantal+ " nests"; | |
}); | |
}); | |
}); | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
gebied | straat | nummer | detailinfo | aantal | lat | lon | symbol | name | |
---|---|---|---|---|---|---|---|---|---|
Oog in Al | Goethelaan | 65 | 1 | 52.088403 | 5.0861954 | Flag. Blue | Goethelaan 65 | ||
Oog in Al | Goethelaan | 74 | 2 | 52.0886557 | 5.0866022 | Flag. Green | Goethelaan 74 | ||
Oog in Al | Goethelaan | 76 | 1 | 52.0884041 | 5.0866185 | Flag. Blue | Goethelaan 76 | ||
Oog in Al | Goethelaan | 78 | achter | 1 | 52.0883681 | 5.0866042 | Flag. Blue | Goethelaan 78 | |
Oog in Al | Goethelaan | 79 | 1 | 52.0879 | 5.0863301 | Flag. Blue | Goethelaan 79 | ||
Oog in Al | Goethelaan | 82 | 1 | 52.0882603 | 5.0866195 | Flag. Blue | Goethelaan 82 | ||
Oog in Al | Goethelaan | 86 | op de hoek met de E. Meijsterlaan | 1 | 52.0881705 | 5.0866639 | Flag. Blue | Goethelaan 86 | |
Oog in Al | H�ndelstraat | 18 | 1 | 52.08402 | 5.08683 | Flag. Blue | H�ndelstraat 18 | ||
Oog in Al | Wagnerlaan | 7 en 8 | tuinzijde | 1 | 52.0848707 | 5.0897353 | Flag. Blue | Wagnerlaan 7 en 8 | |
Oog in Al | E. Meijsterlaan | 26 | 1 | 52.0873787 | 5.085701 | Flag. Blue | E. Meijsterlaan 26 | ||
Oog in Al | E. Meijsterlaan | 85 | 1 | 52.0876953 | 5.0862096 | Flag. Blue | E. Meijsterlaan 85 | ||
Oog in Al | Chopinstraat | 7 | 1 | 52.0839276 | 5.0864443 | Flag. Blue | Chopinstraat 7 | ||
Oog in Al | Von Weberstraat | 27 | 1 | 52.0849131 | 5.0851976 | Flag. Blue | Von Weberstraat 27 | ||
Oog in Al | Mendelssohnstraat | 44 | 1 | 52.08617 | 5.08773 | Flag. Blue | Mendelssohnstraat 44 | ||
Wittevrouwen | Bouwstraat | 53-55 | Zimictheater/oude ULO | 2 | 52.0967809 | 5.1323714 | Flag. Green | Bouwstraat 53-55 | |
Wittevrouwen | Obrechtstraat | 65 | achterzijde (tuinkant) | 1 | 52.0977193 | 5.1299435 | Flag. Blue | Obrechtstraat 65 | |
Wittevrouwen | Obrechtstraat | 67 | 1 | 52.0977642 | 5.1299141 | Flag. Blue | Obrechtstraat 67 | ||
Wittevrouwen | Kapelstraat | 43 | beide dakkapellen. waar daklijst het dak raakt | 2 | 52.0965762 | 5.1291766 | Flag. Green | Kapelstraat 43 | |
Wittevrouwen | Vlasstraat | 4 | rechts onder daklijst bovenaan gevel (bij regenpijp) | 1 | 52.0992943 | 5.1308831 | Flag. Blue | Vlasstraat 4 | |
Wittevrouwen | Bekkerstraat | 113 | 1 | 52.0987512 | 5.133265 | Flag. Blue | Bekkerstraat 113 | ||
Wittevrouwen | Hengeveldstraat | 14 | onder het lood boven dakhoekje van dakkapel | 1 | 52.1012535 | 5.1308135 | Flag. Blue | Hengeveldstraat 14 | |
Wittevrouwen | Admiraal van Gentstraat | 17 | 52.1000127 | 5.1389936 | Puzzle Cache | Admiraal van Gentstraat 17 | |||
Wittevrouwen | Luit Blomstraat | 67 | de zwaluwen lossen hier de spreeuwen af | 1 | 52.1181896 | 5.0758766 | Flag. Blue | Luit Blomstraat 67 | |
Wittevrouwen | Parkstraat | 43 | links onder de daklijst | 1 | 52.091292 | 5.1301613 | Flag. Blue | Parkstraat 43 | |
Overvecht. locatie 1 | Naxosdreef | 65-95 | boven raam 5e en boven raam 7e verdieping | 1 | 52.1153543 | 5.1141328 | Flag. Blue | Naxosdreef 65-95 | |
Overvecht. locatie 1 | Naxosdreef | 1 tot 31 | raampjes 3e. 5e en 7e verdieping: poepstrepen | 1 | 52.1155781 | 5.1137519 | Flag. Blue | Naxosdreef 1 tot 31 | |
Overvecht. locatie 1 | Theemsdreef | 422-452 | onder de dakrand. rechts van raampje | 1 | 52.1151706 | 5.1124404 | Flag. Blue | Theemsdreef 422-452 | |
Overvecht. locatie 1 | Milosdreef | 65-95 | boven raam 1e en boven raam 8e verdieping | 1 | 52.1160078 | 5.1129901 | Flag. Blue | Milosdreef 65-95 | |
Overvecht. locatie 1 | Androsdreef | 162-192 | nest onder dakrand? | 1 | 52.1158511 | 5.1113412 | Flag. Blue | Androsdreef 162-192 | |
Overvecht. locatie 1 | Androsdreef | 2 tot 32 | raampje 4e verdieping: poepstreep | 1 | 52.1164014 | 5.1121992 | Flag. Blue | Androsdreef 2 tot 32 | |
Overvecht. locatie 1 | Tafelbergdreef | 180-214 | boven raam 6e verdieping? | 1 | 52.1170865 | 5.1092166 | Flag. Blue | Tafelbergdreef 180-214 | |
Overvecht. locatie 2 | Kenyadreef | 2 | 1 | 52.1229522 | 5.1115603 | Flag. Blue | Kenyadreef 2 | ||
Overvecht. locatie 2 | Sfinxdreef | 3 | geen invliegers. gedrag gierzwaluwen wijst er wel op | 1 | 52.123338 | 5.1112804 | Flag. Blue | Sfinxdreef 3 | |
Overvecht. locatie 2 | Nijldreef | 16 | veel poepstrepen. geen invliegers | 1 | 52.1231848 | 5.1110916 | Flag. Blue | Nijldreef 16 | |
Overvecht. locatie 2 | Bagdaddreef | 2 | onder loodslab links halverwege schoorsteen | 1 | 52.1246571 | 5.1028173 | Flag. Blue | Bagdaddreef 2 | |
Overvecht. locatie 2 | Koeweitdreef | 4 | onder loodslab rechts onderkant schoorsteen | 1 | 52.1256036 | 5.103965 | Flag. Blue | Koeweitdreef 4 | |
Overvecht. locatie 3 | Zuidpooldreef | 34 | kopse kant onder afdekpan in de nok | 1 | 52.1152987 | 5.1057676 | Flag. Blue | Zuidpooldreef 34 | |
Overvecht. locatie 3 | Zuidpooldreef | 35/36 | onder dakgoot voorkant. mogelijk boven regenpijp | 1 | 52.1151913 | 5.1059581 | Flag. Blue | Zuidpooldreef 35/36 | |
Overvecht. locatie 3 | Zuidpooldreef | 9 | onder dakgoot aan voorkant op de hoek | 1 | 52.1152245 | 5.1048337 | Flag. Blue | Zuidpooldreef 9 | |
Overvecht. locatie 3 | Zuidpooldreef | 27 | onder overhangende pannen aan de kopse kant | 1 | 52.1155494 | 5.1053572 | Flag. Blue | Zuidpooldreef 27 | |
Overvecht. locatie 3 | Zuidpooldreef | 26 | onder overhangende pannen aan de kopse kant | 1 | 52.1153148 | 5.1049791 | Flag. Blue | Zuidpooldreef 26 | |
Overvecht. locatie 3 | Zuidpooldreef | 31 | onder overhangende pannen aan de kopse kant | 1 | 52.1153971 | 5.1055918 | Flag. Blue | Zuidpooldreef 31 | |
Overvecht. overig | Denverdreef | 4 | onder dakgoot aan achterzijde woning | 1 | 52.1247938 | 5.096216 | Flag. Blue | Denverdreef 4 | |
Overvecht. overig | Denverdreef | 8 | nest | 1 | 52.12476 | 5.09642 | Flag. Blue | Denverdreef 8 | |
Overvecht. overig | Bostondreef | 33 | nest met jongen | 3 | 52.12467 | 5.09557 | Flag. Red | Bostondreef 33 | |
Overvecht. overig | Bostondreef | 45 | kopse kant. onder 3e. 5e. 8e en 13e dakpan rechts | 4 | 52.1246394 | 5.0955453 | Flag. Red | Bostondreef 45 | |
Overvecht. overig | Oklahomadreef | 8 | kopse kant. 3e dakpan rechtsboven | 1 | 52.1254946 | 5.0960947 | Flag. Blue | Oklahomadreef 8 | |
Overvecht. overig | Baltimoredreef | 7 | nest met jongen | 1 | 52.12481 | 5.0953 | Flag. Blue | Baltimoredreef 7 | |
Overvecht. overig | Torontodreef | 17 | nest | 1 | 52.12572 | 5.09645 | Flag. Blue | Torontodreef 17 | |
Overvecht. overig | Qu�becdreef | 17 | nest | 1 | 52.12616 | 5.09699 | Flag. Blue | Qu�becdreef 17 | |
Overvecht. overig | Ottawadreef | 39 | nest met jongen | 1 | 52.12635 | 5.0976 | Flag. Blue | Ottawadreef 39 | |
Tuinwijk/Vogelbuurt | Adelaarstraat | 25 | Ierse Pub O'Leary onder daklijst. 1 aan kant Adelaarstr. en 1 kant aan de kant van de Hopakker | 2 | 52.0991074 | 5.1156477 | Flag. Green | Adelaarstraat 25 | |
Tuinwijk/Vogelbuurt | Koekoekstraat | 55 | Food Imperium. hoek Havikstr. Onder daklijst | 2 | 52.0989898 | 5.1192532 | Flag. Green | Koekoekstraat 55 | |
Tuinwijk/Vogelbuurt | Havikstraat | 43 | onder daklijst bovenkant dak | 1 | 52.0992065 | 5.1196897 | Flag. Blue | Havikstraat 43 | |
Tuinwijk/Vogelbuurt | Havikstraat | 51 | nok | 1 | 52.0993422 | 5.1200538 | Flag. Blue | Havikstraat 51 | |
Tuinwijk/Vogelbuurt | Adelaarstraat | 69 | hoek Adelaarstr. Onder dakgootlijst. op meerdere plekken poepstrepen | 1 | 52.10024 | 5.11949 | Flag. Blue | Adelaarstraat 69 | |
Tuinwijk/Vogelbuurt | Johannes de Bekastraat | 71 | nok | 1 | 52.10045 | 5.11931 | Flag. Blue | Johannes de Bekastraat 71 | |
Tuinwijk/Vogelbuurt | Johannes de Bekastraat | 73 | nok | 1 | 52.10048 | 5.1191 | Flag. Blue | Johannes de Bekastraat 73 | |
Tuinwijk/Vogelbuurt | Johannes de Bekastraat | 75 | nok | 1 | 52.10048 | 5.11907 | Flag. Blue | Johannes de Bekastraat 75 | |
Tuinwijk/Vogelbuurt | Johannes de Bekastraat | 18 | nok | 1 | 52.10041 | 5.11856 | Flag. Blue | Johannes de Bekastraat 18 | |
Tuinwijk/Vogelbuurt | Johannes de Bekastraat | 24 | nok | 1 | 52.10045 | 5.11835 | Flag. Blue | Johannes de Bekastraat 24 | |
Hoograven | Verlengde Hoogravenseweg | 298 bis | 1 bij dakraam en 1 bij schoorsteen | 2 | 52.06871 | 5.11898 | Flag. Green | Verlengde Hoogravenseweg 298bis | |
Hoograven | Brasemstraat | 123 | invlieggat | 52.0646574 | 5.1162212 | Puzzle Cache | Brasemstraat 123 | ||
Hoograven | Zeeltstraat | 24 | invlieggat | 52.064172 | 5.1162225 | Puzzle Cache | Zeeltstraat 24 | ||
Hoograven | Duurstedelaan | 53 bis | invlieggat | 52.06334 | 5.11922 | Puzzle Cache | Duurstedelaan 53 bis | ||
Hoograven | Duurstedelaan | 53 bis | onder overhangende pannen aan kopse kant | 1 | 52.06334 | 5.11922 | Flag. Blue | Duurstedelaan 53 bis | |
Hoograven | Soestdijkstraat | 41 | invlieggat | 52.0705814 | 5.1245426 | Puzzle Cache | Soestdijkstraat 41 | ||
Hoograven | Elandlaan | 13 | onder overhangende pannen aan de kopse kant | 2 | 52.074127 | 5.130575 | Flag. Green | Elandlaan 13 | |
Noordwest | De Bazelstraat | 17 | 1 | 52.11625 | 5.07811 | Flag. Blue | De Bazelstraat 17 | ||
Noordwest | De Bazelstraat | 44 | 1 | 52.1165 | 5.07814 | Flag. Blue | De Bazelstraat 44 | ||
Noordwest | Sweder van Zuylenweg | 55 | 1 | 52.1091296 | 5.0897783 | Flag. Blue | Sweder van Zuylenweg 55 | ||
Noordwest | Sweder van Zuylenweg | 57 | 1 | 52.1091656 | 5.0898072 | Flag. Blue | Sweder van Zuylenweg 57 | ||
Noordwest | Johannes Uitenbogaertstraat | 63 | 1 | 52.10908 | 5.08969 | Flag. Blue | Johannes Uitenbogaertstraat 63 | ||
Noordwest | Hermanus Elconiusstraat | 69 | 1 | 52.107735 | 5.0892183 | Flag. Blue | Hermanus Elconiusstraat 69 | ||
Noordwest | Hermanus Elconiusstraat | 77 | 1 | 52.1078424 | 5.0890278 | Flag. Blue | Hermanus Elconiusstraat 77 | ||
Noordwest | Linneausstraat | 23 | 1 | 52.111053 | 5.0862327 | Flag. Blue | Linneausstraat 23 | ||
Noordwest | Kloosterlaan | 63 | onder overhangende pannen aan de kopse kant | 1 | 52.1094169 | 5.1005495 | Flag. Blue | Kloosterlaan 63 | |
Noordwest | Amsterdamsestraatweg | 361 | hoek naast dakraam | 1 | 52.1041615 | 5.0942923 | Flag. Blue | Amsterdamsestraatweg 361 | |
Noordwest | Knopstraat | 52 | 1 | 52.1006099 | 5.0972381 | Flag. Blue | Knopstraat 52 | ||
Noordwest | 2e Daalsedijk | 141 | 1 | 52.1005107 | 5.0970782 | Flag. Blue | 2e Daalsedijk 141 | ||
Noordoost overig | Van Humboldtstraat | 26 | nok | 1 | 52.0995 | 5.12203 | Flag. Blue | Van Humboldstraat 26 | |
Noordoost overig | Van Humboldstraat | 28 | nok | 1 | 52.09954 | 5.12206 | Flag. Blue | Van Humboldstraat 28 | |
Noordoost overig | Menno van Coehoornstraat | 2 | nok | 1 | 52.0995813 | 5.1224458 | Flag. Blue | Menno van Coehoornstraat 2 | |
Noordoost overig | Van Leeuwenhoeckstraat | 2 | nok | 1 | 52.09926 | 5.12164 | Flag. Blue | Van Leeuwenhoeckstraat 2 | |
Noordoost overig | Van Leeuwenhoeckstraat | 8 | nok | 1 | 52.0993 | 5.12139 | Flag. Blue | Van Leeuwenhoeckstraat 8 | |
Noordoost overig | Van Humboldtstraat | 15 | nok | 1 | 52.099113 | 5.1220546 | Flag. Blue | Van Humboldtstraat 15 | |
Noordoost overig | Van Humboldtstraat | 25 | nok | 1 | 52.0992571 | 5.1221705 | Flag. Blue | Van Humboldtstraat 25 | |
Noordoost overig | Van Humboldtstraat | 16 | nok | 1 | 52.0991754 | 5.1218207 | Flag. Blue | Van Humboldtstraat 16 | |
Noordoost overig | Van 's-Gravesandestraat | 4 | nok | 1 | 52.0997057 | 5.1218321 | Flag. Blue | Van 's-Gravesandestraat 4 | |
Noordoost overig | Van 's-Gravesandestraat | 10 | nok | 1 | 52.0997591 | 5.1215983 | Flag. Blue | Van 's-Gravesandestraat 10 | |
Noordoost overig | Nieuwe Koekoekstraat | 135 | nok | 1 | 52.09978 | 5.12127 | Flag. Blue | Nieuwe Koekoekstraat 135 | |
Noordoost overig | Draaiweg | 105 | nok | 1 | 52.1006204 | 5.1169374 | Flag. Blue | Draaiweg 105 | |
Noordoost overig | Draaiweg | 113 | nok | 1 | 52.1006027 | 5.1170835 | Flag. Blue | Draaiweg 113 | |
Noordoost overig | Abraham Bloemaertstraat | 11 | nok | 1 | 52.0997819 | 5.1197593 | Flag. Blue | Abraham Bloemaertstraat 11 | |
Noordoost overig | Abraham Bloemaertstraat | 13 | nok | 1 | 52.0998269 | 5.1197736 | Flag. Blue | Abraham Bloemaertstraat 13 | |
Noordoost overig | Gijsbrecht van Walenborchstraat | 50 | hoek naast dakraam | 1 | 52.1036249 | 5.1180286 | Flag. Blue | Gijsbrecht van Walenborchstraat 50 | |
Noordoost overig | Gijsbrecht van Walenborchstraat | 51 | hoek naast dakraam | 1 | 52.1035175 | 5.1182481 | Flag. Blue | Gijsbrecht van Walenborchstraat 51 | |
Noordoost overig | Van der Mondestraat | 54 | hoek naast dakraam | 1 | 52.1028352 | 5.1185733 | Flag. Blue | Van der Mondestraat 54 | |
Noordoost overig | Van der Mondestraat | 58 | hoek naast dakraam | 1 | 52.1029341 | 5.1186165 | Flag. Blue | Van der Mondestraat 58 | |
Noordoost overig | Van Lynden van Sandenburglaan | 20 | onder overhangende pannen aan de kopse kant | 1 | 52.1065921 | 5.1225211 | Flag. Blue | Van Lynden van Sandenburglaan 20 | |
Noordoost overig | Van Lynden van Sandenburglaan | 22 | onder overhangende pannen aan de kopse kant | 1 | 52.1067091 | 5.1225934 | Flag. Blue | Van Lynden van Sandenburglaan 22 | |
Noordoost overig | Hopakker | 37 | 1 | 52.0978886 | 5.1172166 | Flag. Blue | Hopakker 37 | ||
Noordoost overig | Hopakker | 105 | 1 | 52.0991712 | 5.1160122 | Flag. Blue | Hopakker 105 | ||
Noordoost overig | Jacob van der Borchstraat | 61 | 1 | 52.104583 | 5.120402 | Flag. Blue | Jacob van der Borchstraat 61 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment