Skip to content

Instantly share code, notes, and snippets.

@andrewthornton
Last active August 29, 2015 14:16
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 andrewthornton/add904cb57bb66e9e7ee to your computer and use it in GitHub Desktop.
Save andrewthornton/add904cb57bb66e9e7ee to your computer and use it in GitHub Desktop.
d3.austin() Meetup - March Demo
<!DOCTYPE html>
<meta charset='utf-8'>
<style>
body {
font-family: 'Helvetica'
}
.precincts {
fill: #ddd;
stroke: #fff;
}
.adler {
fill: #d95f02;
background: #d95f02;
}
.martinez {
fill: #1b9e77;
background: #1b9e77;
}
.na {
fill: #ddd;
background: #ddd;
}
svg {
border: 1px solid #ddd
}
</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script>
var width = 960,
height = 500;
var projection = d3.geo.mercator()
.scale(39000)
.center([-97.75, 30.32])
.translate([width / 2, height / 2]);
var path = d3.geo.path()
.projection(projection);
var svg = d3.select('body').append('svg')
.attr('width', width)
.attr('height', height);
var legend = svg.append('g')
.attr('transform', 'translate(' + (width - 120) + ',10)');
var key = legend.selectAll('g')
.data(['Adler', 'Martinez', 'NA'])
.enter().append('g')
.attr('transform', function (d,i) {return 'translate(0,' + (i*25) + ')';});
var name = key.selectAll('text')
.data(function (d) {return [d];})
.enter().append('text')
.attr('dy', '1.33em')
.text(function (d) {return d;});
var colorKey = key.selectAll('rect')
.data(function (d) {return [d];})
.enter().append('rect')
.attr('width', 25)
.attr('height', 25)
.attr('transform', function (d,i) {return 'translate(75,' + (i*25) + ')';})
.classed('adler', function (d) {return d === 'Adler';})
.classed('martinez', function (d) {return d === 'Martinez';})
.classed('na', function (d) {return d === 'NA';});
d3.json('precincts.json', draw);
function draw(error, data) {
svg.append('g')
.attr('class', 'precincts')
.selectAll('path')
.data(topojson.feature(data, data.objects.precincts).features)
.enter().append('path')
.attr('d', path)
.classed('adler', function (d) {
return d.properties.adler > d.properties.martinez;
})
.classed('martinez', function (d) {
return d.properties.adler < d.properties.martinez;
});
}
</script>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Precinct Registered Martinez Adler
101 561 30 33.00
102 1050 29 58.00
103 1634 69 185.00
104 1245 78 158.00
105 0 0 0.00
106 0 0 0.00
108 1508 67 100.00
109 2472 79 174.00
111 4517 124 287.00
112 1732 22 50.00
113 574 24 37.00
116 0 0 0.00
117 2728 94 108.00
118 863 30 31.00
120 1 0 0.00
121 984 46 44.00
122 3045 177 300.00
124 5493 370 299.00
125 0 0 0.00
126 5325 405 335.00
127 0 0 0.00
128 0 0 0.00
129 3022 175 178.00
130 2038 167 168.00
131 0 0 0.00
132 2850 177 293.00
133 2512 249 268.00
134 0 0 0.00
135 5054 574 470.00
139 3709 205 249.00
140 2042 132 219.00
141 457 10 26.00
142 1205 83 45.00
148 1 0 0.00
149 1623 188 165.00
151 2528 201 279.00
152 3603 436 286.00
153 3592 115 231.00
154 2433 82 163.00
156 6146 387 447.00
160 144 0 6.00
164 2273 94 94.00
200 5014 306 199.00
202 3631 214 225.00
203 231 0 2.00
205 2938 67 129.00
206 1402 35 56.00
207 4105 145 289.00
208 7441 33 39.00
209 1299 52 75.00
210 1831 137 447.00
211 1929 74 169.00
212 2381 41 498.00
213 0 0 0.00
214 2620 157 579.00
215 7 0 0.00
216 3 0 0.00
217 2431 161 216.00
218 4951 117 210.00
219 0 0 0.00
220 1748 109 491.00
221 854 12 117.00
222 2971 195 343.00
223 777 48 63.00
224 280 7 15.00
225 0 0 0.00
226 1866 36 97.00
227 234 0 5.00
228 1781 64 223.00
231 2791 197 798.00
232 347 4 21.00
233 3777 103 446.00
234 2379 63 428.00
235 2754 172 183.00
236 3208 281 475.00
237 2133 113 666.00
238 2943 188 551.00
239 2495 230 491.00
240 1053 98 224.00
241 1786 149 215.00
242 5360 486 587.00
243 1859 154 332.00
244 761 34 99.00
245 1396 27 174.00
246 1825 134 458.00
247 799 35 267.00
248 2637 163 254.00
249 3164 185 614.00
250 5315 282 636.00
251 3214 221 580.00
252 2844 164 357.00
253 3032 183 958.00
254 3793 168 462.00
256 2091 142 648.00
258 2716 158 312.00
259 2909 169 352.00
260 1522 57 112.00
262 4883 246 897.00
263 3016 136 307.00
266 554 28 176.00
267 1648 86 230.00
268 1330 57 117.00
273 3032 220 545.00
274 2952 128 148.00
275 3699 228 236.00
277 6494 47 58.00
301 498 15 24.00
302 609 32 98.00
303 45 0 6.00
304 4324 245 890.00
305 11 0 5.00
307 383 16 113.00
309 2220 81 205.00
310 2382 79 170.00
311 5594 96 139.00
312 0 0 0.00
313 416 14 10.00
314 2418 60 309.00
315 2339 124 455.00
317 1145 41 201.00
318 11 0 4.00
321 777 43 172.00
323 2283 97 152.00
324 0 0 1.00
325 47 2 6.00
326 2349 77 405.00
327 3021 172 724.00
328 4379 175 536.00
329 4870 91 294.00
330 71 0 6.00
331 2889 202 529.00
332 2864 262 353.00
333 2963 170 577.00
334 3157 146 737.00
335 2662 103 441.00
336 2301 109 485.00
337 3865 178 779.00
338 622 26 87.00
339 1891 157 372.00
340 2283 121 173.00
341 6 0 0.00
342 4917 383 549.00
343 2973 31 57.00
344 1890 116 212.00
345 5 0 0.00
347 2868 133 641.00
349 5044 328 737.00
350 4122 168 344.00
351 1994 94 205.00
352 3609 185 322.00
354 4505 330 995.00
356 2038 82 117.00
358 4899 315 571.00
359 167 4 12.00
360 4406 229 634.00
362 2969 244 564.00
363 1623 107 385.00
364 24 4 7.00
365 1123 22 77.00
366 4889 334 846.00
367 5620 303 1030.00
368 0 0 0.00
374 215 9 38.00
375 57 2 2.00
401 1395 40 36.00
402 1653 26 49.00
404 2058 62 62.00
405 5 0 0.00
406 2837 106 510.00
407 2019 66 67.00
408 3273 82 192.00
409 2074 155 127.00
410 3184 108 152.00
411 1933 41 69.00
412 115 3 2.00
413 912 15 8.00
414 3052 110 191.00
415 1304 60 86.00
416 162 7 4.00
417 1656 39 73.00
419 576 24 38.00
420 2660 150 179.00
421 2872 159 249.00
422 2414 167 167.00
423 4594 244 191.00
424 2890 195 192.00
425 739 47 77.00
426 3321 256 153.00
427 2417 201 130.00
428 1310 61 122.00
429 7238 156 140.00
430 1658 69 46.00
431 6449 259 196.00
432 2 0 0.00
433 2906 163 143.00
434 4 0 1.00
435 5898 262 449.00
436 463 32 10.00
437 2593 160 222.00
438 1516 163 116.00
439 3027 244 169.00
440 1030 40 46.00
441 4111 256 302.00
442 1453 60 59.00
443 4492 130 147.00
444 270 10 7.00
446 1174 96 100.00
447 3978 173 214.00
448 3052 93 93.00
450 3806 129 176.00
451 3257 141 196.00
452 2534 63 74.00
454 2127 164 285.00
458 3503 178 312.00
460 3592 278 332.00
461 3987 213 252.00
463 3294 168 215.00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment