Created
November 18, 2015 23:05
-
-
Save octaviomtz/3b0de4461804d42ec99a to your computer and use it in GitHub Desktop.
Chihuahua population of the four counties with most inhabitants
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
number | name | latitude | longitude | population | |
---|---|---|---|---|---|
1 | Chihuahua | 28.616667 | -106.066666 | 819543 | |
2 | Cuauhtemoc | 28.4 | -106.86666 | 154639 | |
3 | Delicias | 28.18333 | -105.466667 | 137935 | |
4 | Juarez | 31.733334 | -106.433334 | 1332131 |
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
number | name | value | |
---|---|---|---|
1 | Ahumada | 1.244934621 | |
2 | Almada | 1.239067295 | |
3 | Allende | 1.208994682 | |
4 | Aquiles Serd�n | 1.503512212 | |
5 | Ascenci�n | 2.316241348 | |
6 | Bach�niva | 2.4433414 | |
7 | Balleza | 2.513943111 | |
8 | Batopilas | 2.859475686 | |
9 | Bocoyna | 3.693530133 | |
10 | Buenaventura | 3.557968157 | |
11 | Camargo | 3.886816282 | |
12 | Carichic | 3.639042652 | |
13 | Casas Grandes | 4.767533387 | |
14 | Coronado | 4.514153126 | |
15 | Coyame del Sotol | 4.88779719 | |
16 | La Cruz | 5.769025021 | |
17 | Cuauht�moc | 5.362639975 | |
18 | Cusihuiriachic | 5.952194873 | |
19 | Chihuahua | 6.132853901 | |
20 | Ch�nipas | 6.292191796 | |
21 | Delicias | 6.871115455 | |
22 | Dr. Belisario Dom�nguez | 6.654278945 | |
23 | Galeana | 6.943273233 | |
24 | Santa Isabel | 7.834410153 | |
25 | G�mez Farias | 8.315226609 | |
26 | Gran Morelos | 8.216186278 | |
27 | Guachochic | 8.611295539 | |
28 | Guadalupe | 8.769496813 | |
29 | Guadalupe y Calvo | 8.870938923 | |
30 | Guazapares | 9.797070773 | |
31 | Guerrero | 9.995127519 | |
32 | Hidalgo del Parral | 10.16440841 | |
33 | Huejotit�n | 9.969003982 | |
34 | Ignacio Zaragoza | 10.74051271 | |
35 | Janos | 11.43696679 | |
35 | Jim�nez | 11.30005214 | |
37 | Ju�rez | 11.70753643 | |
38 | Julimes | 11.83555489 | |
39 | L�pez | 12.54508309 | |
40 | Madera | 12.6460873 | |
41 | Maguarichic | 13.28682843 | |
42 | Manuel Benavides | 12.92148623 | |
43 | Matachic | 13.71668669 | |
44 | Matamoros | 13.2595597 | |
45 | Meoqui | 14.17326126 | |
46 | Morelos | 13.90589353 | |
47 | Moris | 14.22836772 | |
48 | Namiquipa | 14.56795232 | |
49 | Nonoava | 14.90014591 | |
50 | Nuevo Casas Grandes | 15.94693584 | |
51 | Ocampo | 15.34152283 | |
52 | Ojinaga | 15.94572073 | |
53 | Pr�xedis G. Guerrero | 16.69632797 | |
54 | Riva Palacio | 16.62153083 | |
55 | Rosales | 16.94439527 | |
56 | Rosario | 16.87504608 | |
57 | San Francisco de Borja | 17.99306009 | |
58 | San Francisco de Conchos | 17.43443316 | |
59 | San Francisco del Oro | 18.5952124 | |
60 | Santa B�rbara | 18.41458656 | |
61 | Satev� | 19.06513358 | |
62 | Saucillo | 19.41486889 | |
63 | Tem�sachic | 19.12955095 | |
64 | El Tule | 19.41003003 | |
65 | Urique | 19.68598405 | |
66 | Uruachic | 19.90791847 | |
67 | Valle de Zaragoza | 20.49020054 |
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>Howework 4 | Octavio</title> | |
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> | |
<script src="script1.js"></script> | |
<style type="text/css"> | |
body { | |
margin: 0; | |
background-color: #bbccbb; | |
font-family: Helvetica, Arial, sans-serif; | |
} | |
#container { | |
width: 600px; | |
margin-left: auto; | |
margin-right: auto; | |
margin-top: 50px; | |
padding: 50px; | |
background-color: #ffffff; | |
box-shadow: 3px 3px 5px 6px #000; | |
} | |
#title { | |
width: 800px; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
#someText { | |
width: 800px; | |
margin-left: auto; | |
margin-right: auto; | |
font-family: Helvetica, Arial, sans-serif; | |
} | |
path:hover { | |
fill: #0d3; | |
} | |
</style> | |
</head> | |
<body> | |
<h1 id="title">Counties of Chihuahua (south of Texas) </h1> | |
<div id="container"></div> | |
<div id="someText"> | |
<p>The .shp file was obtained from <a href="http://www.numeroslocos.com/2013/07/10/shapefile/">here</a> and converted in mapshaper.org <br> | |
The colors of the counties don't mean anything in particular. The pink circles represent the population of the four counties with most inhabitants. | |
</p> | |
</div> | |
<script src="script1.js"></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
//Width and height | |
var w = 500; | |
var h = 500; | |
//Define map projection | |
var projection = d3.geo.equirectangular() | |
.center([-102, 24]) | |
.translate([w, h]) | |
.scale([w * 7]); | |
//Define path generator | |
var path = d3.geo.path() | |
.projection(projection); | |
var color = d3.scale.quantize() | |
.range(["#f6eff7", "#bdc9e1", "#67a9cf", "#1c9099", "#016c59"]); | |
//Create SVG | |
var svg = d3.select("#container") | |
.append("svg") | |
.attr("width", w) | |
.attr("height", h); | |
d3.csv("chihvalues.csv", function (data) { | |
color.domain([ | |
d3.min(data, function (d) { | |
return +d["value"]; | |
}), | |
d3.max(data, function (d) { | |
return +d["value"]; | |
}) | |
]); | |
// console.log(data) | |
d3.json("chih.json", function (json) { | |
//Bind data and create one path per GeoJSON feature | |
for (var i = 0; i < data.length; i++) { | |
var dataValue = +data[i]["value"]; | |
json.geometries[i].newvalue = dataValue; | |
} | |
// console.log(json.geometries) | |
var counties = svg.selectAll("path") | |
.data(json.geometries) | |
.enter() | |
.append("path") | |
.attr("d", path) | |
.style("fill", function (d, i) { | |
//Get data value | |
var value = d.newvalue; | |
if (value) { | |
//If value exists… | |
return color(value); | |
} else { | |
//If value is undefined… | |
return "#F10"; | |
} | |
}) | |
.attr("stroke", "#040"); | |
d3.csv("chihLatitudeLongitude.csv", function (data2) { | |
svg.selectAll("circle") | |
.data(data2) | |
.enter() | |
.append("circle") | |
.attr("cx", function (d) { | |
return projection([d.longitude, d.latitude])[0]; | |
}) | |
.attr("cy", function (d) { | |
return projection([d.longitude, d.latitude])[1]; | |
}) | |
.attr("r", function (d) { | |
//Use Math.sqrt to scale by area (not radius) | |
return Math.sqrt(+d.population / w * 0.1); | |
}) | |
.style("fill", "#FF6c99") | |
.style("opacity", 0.75); | |
}); | |
}); //end of json | |
}); //end of csv |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment