Skip to content

Instantly share code, notes, and snippets.

@davo

davo/estaciones.csv

Created November 19, 2012 19:42
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 davo/4113252 to your computer and use it in GitHub Desktop.
Save davo/4113252 to your computer and use it in GitHub Desktop.
Download ZIP
Public Bicycles
Raw
estaciones.csv
name latitude longitude population color
Aduana -34.611365 -58.369077 0 #C4C4C4
Cmd -34.654286 -58.380429 0 #BABABA
Congreso -34.609829 -58.389289 0 #7F7F7F
Derecho -34.583669 -58.391243 0 #DEDEDE
Independencia -34.617908 -58.380470 0 #BEBEBE
Obelisco -34.606297 -58.381051 0 #556270
Once -34.609475 -58.407615 0 #DCDCDC
Pacifico -34.577468 -58.426158 0 #454545
Parque Las Heras -34.585030 -58.407637 0 #858585
Parque Lezama -34.628170 -58.369853 0 #ABABAB
Pza. Almagro -34.605926 -58.419482 0 #B8B8B8
Pza. De Mayo -34.609917 -58.374721 0 #C0C0C0
Pza. Houssay -34.599020 -58.398217 0 #EDEDED
Pza. Italia -34.580224 -58.420751 0 #5E5E5E
Pza. Roma -34.601599 -58.369421 0 #6CDFEA
Pza. San Martin -34.594958 -58.378283 0 #D3D3D3
Pza. Vicente Lopez -34.593367 -58.389698 0 #4A4A4A
Retiro -34.592308 -58.375010 0 #C3FF68
Tribunales -34.601342 -58.385008 0 #CFCFCF
UCA Puerto Madero -34.615974 -58.365666 0 #A1A1A1
Virrey Cevallos -34.622755 -58.388947 0 #7A7A7A
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>Vinculos recorridos entre estaciones</title>
<style>
@import url(http://bost.ocks.org/mike/style.css?20120427);
#circle circle {
fill: none;
pointer-events: all;
}
.group path {
fill-opacity: .5;
}
path.chord {
}
#circle:hover path.fade {
display: none;
}
</style>
<header>
<aside>Visualizacion</aside>
</header>
<script src="http://d3js.org/d3.v2.min.js?2.8.1"></script>
<script>
var width = 920,
height = 660,
outerRadius = Math.min(width, height) / 2 - 10,
innerRadius = outerRadius - 24;
var formatPercent = d3.format("100");
var arc = d3.svg.arc()
.innerRadius(innerRadius)
.outerRadius(outerRadius);
var layout = d3.layout.chord()
.padding(.05)
.sortSubgroups(d3.descending)
.sortChords(d3.ascending);
var path = d3.svg.chord()
.radius(innerRadius);
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height)
.append("g")
.attr("id", "circle")
.attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
svg.append("circle")
.attr("r", outerRadius);
d3.csv("estaciones.csv", function(cities) {
d3.json("matrix.json", function(matrix) {
// Compute the chord layout.
layout.matrix(matrix);
// Add a group per neighborhood.
var group = svg.selectAll(".group")
.data(layout.groups)
.enter().append("g")
.attr("class", "group")
.on("mouseover", mouseover);
// Add a mouseover title.
group.append("title").text(function(d, i) {
return cities[i].name + ": " + formatPercent(d.value) + " de nodos creados";
});
// Add the group arc.
var groupPath = group.append("path")
.attr("id", function(d, i) { return "group" + i; })
.attr("d", arc)
.style("fill", function(d, i) { return cities[i].color; });
// Add a text label.
var groupText = group.append("text")
.attr("x", 6)
.attr("dy", 15);
// groupText.append("textPath")
// .attr("xlink:href", function(d, i) { return "#group" + i; })
// .text(function(d, i) { return cities[i].name; });
// Remove the labels that don't fit. :(
groupText.filter(function(d, i) { return groupPath[0][i].getTotalLength() / 2 - 16 < this.getComputedTextLength(); })
.remove();
// Add the chords.
var chord = svg.selectAll(".chord")
.data(layout.chords)
.enter().append("path")
.attr("class", "chord")
.style("fill", function(d) { return cities[d.source.index].color; })
.attr("d", path);
// Add an elaborate mouseover title for each chod.
chord.append("title").text(function(d) {
return cities[d.source.index].name
+ " → " + cities[d.target.index].name
+ ": " + formatPercent(d.source.value)
+ "\n" + cities[d.target.index].name
+ " → " + cities[d.source.index].name
+ ": " + formatPercent(d.target.value);
});
function mouseover(d, i) {
chord.classed("fade", function(p) {
return p.source.index != i
&& p.target.index != i;
});
}
});
});
</script>
</html>
Raw
matrix.json
[
[
8829,
2,
1565,
2583,
499,
2121,
505,
672,
1949,
3162,
303,
1015,
633,
1614,
3006,
236,
946,
6849,
1288,
3326,
420
],
[
1,
14,
7,
3,
6,
16,
5,
1,
4,
12,
2,
27,
6,
0,
0,
0,
2,
5,
3,
3,
11
],
[
1396,
7,
5700,
768,
930,
1880,
1236,
266,
1057,
1588,
775,
1359,
863,
1002,
1101,
381,
1126,
1555,
1640,
1070,
2006
],
[
1216,
1,
660,
6535,
121,
660,
378,
2768,
3301,
560,
231,
255,
450,
4848,
2312,
282,
1494,
8756,
784,
1249,
86
],
[
529,
23,
1106,
295,
1909,
1429,
656,
160,
403,
703,
475,
924,
555,
187,
719,
586,
342,
892,
612,
831,
508
],
[
1978,
24,
2571,
1374,
1572,
10481,
1998,
499,
1495,
1457,
1038,
1558,
1181,
1089,
2458,
707,
1591,
4080,
2463,
1082,
1131
],
[
389,
32,
1120,
279,
357,
1207,
1803,
268,
551,
564,
482,
1425,
1169,
375,
588,
222,
511,
561,
908,
202,
536
],
[
163,
1,
135,
1780,
141,
206,
334,
3760,
1089,
209,
386,
253,
394,
1037,
619,
191,
723,
816,
147,
180,
122
],
[
836,
2,
861,
2831,
271,
646,
768,
1104,
8342,
357,
1057,
480,
969,
1907,
2483,
335,
1349,
3165,
1106,
1331,
166
],
[
2818,
47,
994,
905,
494,
1020,
365,
223,
449,
9435,
218,
671,
333,
369,
2454,
159,
406,
1820,
618,
1836,
440
],
[
217,
3,
800,
348,
307,
449,
635,
561,
937,
107,
2465,
1005,
653,
548,
282,
70,
274,
109,
448,
221,
251
],
[
1576,
21,
1180,
496,
1091,
1716,
1265,
356,
697,
1453,
554,
4809,
859,
306,
2304,
688,
752,
2002,
1583,
1559,
826
],
[
307,
37,
936,
755,
465,
895,
1890,
809,
1467,
436,
980,
893,
2723,
928,
1071,
613,
733,
979,
889,
382,
778
],
[
641,
0,
511,
3504,
94,
483,
287,
817,
1453,
342,
361,
143,
440,
8365,
1742,
205,
1004,
2486,
338,
457,
121
],
[
2442,
8,
983,
3327,
614,
2129,
510,
893,
3007,
2811,
341,
1380,
584,
2505,
9468,
599,
1548,
8605,
1361,
4710,
364
],
[
336,
5,
415,
524,
454,
736,
241,
340,
485,
264,
160,
915,
464,
342,
828,
1379,
735,
551,
559,
477,
207
],
[
595,
10,
1083,
2425,
346,
1252,
622,
1052,
1745,
401,
309,
910,
674,
1330,
2067,
703,
4260,
2761,
1331,
1440,
514
],
[
5666,
21,
1395,
10458,
644,
2724,
697,
2484,
6389,
2779,
267,
1930,
880,
6186,
11028,
292,
2310,
6132,
1980,
9908,
338
],
[
1484,
43,
2040,
2085,
647,
2384,
1291,
618,
1410,
923,
615,
1874,
1176,
1066,
2156,
676,
1474,
3588,
5723,
1457,
757
],
[
2307,
5,
1010,
2692,
859,
823,
275,
417,
1820,
1901,
300,
885,
449,
902,
3529,
188,
1997,
10208,
1119,
6321,
492
],
[
486,
15,
1777,
128,
371,
1033,
586,
117,
191,
666,
212,
1006,
460,
237,
441,
153,
406,
352,
593,
456,
2322
]
]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment