Skip to content

Instantly share code, notes, and snippets.

@officeofjane

officeofjane/.block

Last active February 18, 2019 09:11
Show Gist options
  • Save officeofjane/83a8ddf698e50bdfd246ff4ef78f7c62 to your computer and use it in GitHub Desktop.
Save officeofjane/83a8ddf698e50bdfd246ff4ef78f7c62 to your computer and use it in GitHub Desktop.
Download ZIP
India choropleth
Raw
.block
license: mit
Raw
README.md

Percentage of Muslim population by district.

Example shows how to load data asynchronously using ES6 promises.

Raw
data.csv
dist_code muslim_pc
1 0.945920855
2 0.976529198
3 0.142762966
4 0.768731978
5 0.904461711
6 0.627131994
7 0.10420239
8 0.951535605
9 0.973928695
10 0.951903618
11 0.97692018
12 0.9548908
13 0.985154856
14 0.979895095
15 0.984906345
16 0.538166933
17 0.706756476
18 0.577491591
19 0.107698406
20 0.496636126
21 0.070256177
22 0.071966585
23 0.062524081
24 0.013109945
25 0.002344443
26 0.006791458
27 0.00946211
28 0.008160205
29 0.027390137
30 0.018284829
31 0.025292942
32 0.062686962
33 0.014508421
34 0.005325662
35 0.012037908
36 0.012500491
37 0.01378243
38 0.014552273
39 0.011152847
40 0.028005725
41 0.022211717
42 0.009428107
43 0.003372967
44 0.004804323
45 0.005060663
46 0.011738355
47 0.013478385
48 0.021123224
49 0.005019561
50 0.003443111
51 0.021167731
52 0.029647265
53 0.10821614
54 0.021997323
55 0.048744138
56 0.010766891
57 0.011223044
58 0.006133273
59 0.011914091
60 0.119088651
61 0.033365295
62 0.012442107
63 0.005540635
64 0.012452892
65 0.033479942
66 0.126483729
67 0.225766601
68 0.342843556
69 0.041780318
70 0.01962423
71 0.114123233
72 0.016555141
73 0.007662636
74 0.021025374
75 0.071859417
76 0.031103427
77 0.017251408
78 0.008874631
79 0.007353367
80 0.012414482
81 0.009492519
82 0.007712937
83 0.008604922
84 0.006138243
85 0.006345437
86 0.046777934
87 0.791954744
88 0.089339146
89 0.200023401
90 0.079673702
91 0.134904243
92 0.293352052
93 0.104605504
94 0.059716628
95 0.333627559
96 0.058903927
97 0.049146561
98 0.163223129
99 0.02574082
100 0.066869631
101 0.099723893
102 0.122446798
103 0.10677267
104 0.148967974
105 0.145690224
106 0.059889798
107 0.05592533
108 0.11656687
109 0.027831467
110 0.103747892
111 0.122354223
112 0.137400941
113 0.111619089
114 0.250969147
115 0.123357418
116 0.043193911
117 0.029410062
118 0.070415146
119 0.121623181
120 0.10774868
121 0.059959168
122 0.059134582
123 0.029117316
124 0.020641647
125 0.02716796
126 0.06336372
127 0.125059584
128 0.06541294
129 0.068146853
130 0.033993717
131 0.029494796
132 0.419472522
133 0.413044055
134 0.43044625
135 0.471162861
136 0.505748519
137 0.40775972
138 0.344294447
139 0.279792456
140 0.253495513
141 0.130755439
142 0.222168908
143 0.198504364
144 0.101902719
145 0.085165814
146 0.093082574
147 0.126017751
148 0.05390497
149 0.21470324
150 0.345415916
151 0.241105028
152 0.175477908
153 0.200833424
154 0.199314584
155 0.135900333
156 0.116927313
157 0.214619775
158 0.121343662
159 0.146852012
160 0.165377492
161 0.072044683
162 0.073910601
163 0.09816756
164 0.157305794
165 0.101528781
166 0.07397267
167 0.027606599
168 0.082649859
169 0.065589903
170 0.087590933
171 0.034847186
172 0.133207583
173 0.140970434
174 0.137799169
175 0.133809822
176 0.226057664
177 0.1480399
178 0.167513245
179 0.171251241
180 0.335269549
181 0.307851267
182 0.375105007
183 0.197621144
184 0.292296283
185 0.147906401
186 0.235782421
187 0.170838264
188 0.090938201
189 0.174003744
190 0.115622458
191 0.155766266
192 0.194270724
193 0.065881139
194 0.107638639
195 0.101692195
196 0.110142281
197 0.148765476
198 0.129188519
199 0.078401022
200 0.055604682
201 0.082472612
202 0.148826597
203 0.219842634
204 0.194210031
205 0.151379208
206 0.216177889
207 0.182492274
208 0.183596701
209 0.42945487
210 0.679776976
211 0.384620993
212 0.444686455
213 0.120773598
214 0.140277514
215 0.223873459
216 0.155287726
217 0.170200998
218 0.182641818
219 0.102849998
220 0.095558796
221 0.106151119
222 0.13712923
223 0.105338937
224 0.176806903
225 0.12331903
226 0.080727318
227 0.040848746
228 0.059171012
229 0.06881754
230 0.075354053
231 0.072503479
232 0.06178268
233 0.095477452
234 0.101518691
235 0.093443377
236 0.111153391
237 0.110129753
238 0.123619849
239 0.067307496
240 0.091688153
241 0.018646045
242 0.007072965
243 0.012863466
244 0.021856035
245 0.015747244
246 0.023467188
247 0.008285678
248 0.03481846
249 0.006243409
250 0.019755242
251 0.023071341
252 0.011636467
253 0.014396934
254 0.009850413
255 0.01784897
256 0.00511534
257 0.013868066
258 0.041549556
259 0.026391996
260 0.030944395
261 0.013761688
262 0.010569206
263 0.00548463
264 0.012281851
265 0.082394651
266 0.005813313
267 0.005351075
268 0.012578243
269 0.00762121
270 0.016358941
271 0.019428895
272 0.003441525
273 0.00418767
274 0.010527353
275 0.078732429
276 0.2542187
277 0.04690806
278 0.175831428
279 0.006059848
280 0.021403504
281 0.020633597
282 0.052718718
283 0.013149842
284 0.005558869
285 0.005158846
286 0.007991179
287 0.004427706
288 0.009085446
289 0.088536563
290 0.056230529
291 0.021827988
292 0.152370426
293 0.166002633
294 0.010565651
295 0.007377015
296 0.003997799
297 0.007100912
298 0.017174745
299 0.004165781
300 0.284363721
301 0.796725215
302 0.575221959
303 0.707380986
304 0.525637049
305 0.553587618
306 0.182180852
307 0.185653134
308 0.01963905
309 0.036427399
310 0.048649851
311 0.08301377
312 0.050065186
313 0.084649935
314 0.021216903
315 0.020354784
316 0.377064143
317 0.563601278
318 0.603147903
319 0.502207622
320 0.226579448
321 0.396551792
322 0.120477248
323 0.359608573
324 0.142883457
325 0.643394723
326 0.126635869
327 0.056900959
328 0.115113537
329 0.255413634
330 0.499202896
331 0.246253004
332 0.512717591
333 0.662683122
334 0.37061801
335 0.207288752
336 0.267567536
337 0.258215839
338 0.157670074
339 0.080755164
340 0.077556342
341 0.261986269
342 0.206021135
343 0.355683518
344 0.104939294
345 0.145889764
346 0.147174444
347 0.111910602
348 0.149412433
349 0.207970316
350 0.202822516
351 0.220152853
352 0.346127605
353 0.358679597
354 0.160835944
355 0.117076801
356 0.205747201
357 0.088930341
358 0.122840769
359 0.096024914
360 0.162149213
361 0.135908106
362 0.080869989
363 0.207834729
364 0.140948298
365 0.024670746
366 0.05016421
367 0.025189383
368 0.025362468
369 0.059703903
370 0.005081502
371 0.022058481
372 0.019325732
373 0.002252656
374 0.034102292
375 0.015402948
376 0.013376788
377 0.040617463
378 0.069175755
379 0.034885005
380 0.041275459
381 0.053825344
382 0.05124913
383 0.0040283
384 0.005897218
385 0.00548199
386 0.037332241
387 0.027134389
388 0.00377299
389 0.002692894
390 0.002916343
391 0.002282608
392 0.002566443
393 0.004736819
394 0.008112952
395 0.003154986
396 0.004759735
397 0.005530957
398 0.006414684
399 0.003051247
400 0.039273535
401 0.034510989
402 0.018006996
403 0.011601195
404 0.025024034
405 0.008750348
406 0.021764668
407 0.014839652
408 0.015384485
409 0.024970752
410 0.025354637
411 0.01217134
412 0.013034818
413 0.008064721
414 0.008783618
415 0.005549993
416 0.012062484
417 0.006335462
418 0.060180763
419 0.038738638
420 0.039210689
421 0.069750241
422 0.036203184
423 0.029663104
424 0.03054528
425 0.039918292
426 0.034641719
427 0.04350718
428 0.037941211
429 0.026681352
430 0.036114238
431 0.024762779
432 0.081499443
433 0.093663809
434 0.103823942
435 0.117337171
436 0.115506177
437 0.111439105
438 0.053162399
439 0.126695267
440 0.072120493
441 0.042010822
442 0.069172617
443 0.102509125
444 0.221602903
445 0.105221256
446 0.090365929
447 0.023861182
448 0.067734217
449 0.042106578
450 0.028816401
451 0.08267483
452 0.035763023
453 0.009561065
454 0.0156962
455 0.048156746
456 0.057818293
457 0.022649142
458 0.03963129
459 0.048169917
460 0.039796898
461 0.028659823
462 0.030539478
463 0.039527342
464 0.01534855
465 0.024224999
466 0.088756936
467 0.238623363
468 0.211413272
469 0.068419993
470 0.1062688
471 0.067040152
472 0.061172557
473 0.041151699
474 0.12243006
475 0.062451175
476 0.094988169
477 0.148512651
478 0.057332065
479 0.122073638
480 0.065450835
481 0.073901398
482 0.119899462
483 0.114997924
484 0.066301904
485 0.031194319
486 0.092322018
487 0.038285812
488 0.221474398
489 0.015738684
490 0.059164215
491 0.055129984
492 0.10865598
493 0.027643608
494 0.061258978
495 0.084148912
496 0.037595757
497 0.058352419
498 0.091620499
499 0.132452008
500 0.136968547
501 0.196952323
502 0.119175382
503 0.14589511
504 0.041401504
505 0.084015928
506 0.022078855
507 0.019778345
508 0.01963107
509 0.041871209
510 0.08629364
511 0.140407617
512 0.108338677
513 0.166857108
514 0.139976805
515 0.212541763
516 0.113481379
517 0.122568884
518 0.191919984
519 0.250589954
520 0.086350695
521 0.071447115
522 0.070599114
523 0.123941558
524 0.149810366
525 0.107943768
526 0.102195214
527 0.048928986
528 0.115906503
529 0.030911515
530 0.073931353
531 0.084902501
532 0.100673455
533 0.153486704
534 0.0648055
535 0.112896962
536 0.434507901
537 0.116584519
538 0.082449961
539 0.054071748
540 0.056178998
541 0.056798707
542 0.003338742
543 0.007004983
544 0.020120781
545 0.015089743
546 0.021880301
547 0.067968995
548 0.114523612
549 0.064946984
550 0.097308066
551 0.15754133
552 0.165472585
553 0.108659622
554 0.095319573
555 0.110554284
556 0.11641263
557 0.169743599
558 0.196785064
559 0.141030852
560 0.116387994
561 0.134951201
562 0.209436482
563 0.130794639
564 0.186476164
565 0.130814097
566 0.077586269
567 0.136625757
568 0.133883097
569 0.082166812
570 0.088961748
571 0.091797251
572 0.129739374
573 0.043084691
574 0.067557747
575 0.240181964
576 0.157386852
577 0.096813297
578 0.046248449
579 0.199945369
580 0.132286329
581 0.130091688
582 0.117767133
583 0.093097042
584 0.105585811
585 0.070831826
586 0.099327595
587 0.965799637
588 0.372435606
589 0.294285421
590 0.286492868
591 0.39242256
592 0.702383951
593 0.289307863
594 0.170716071
595 0.156714258
596 0.074127978
597 0.064064691
598 0.105529731
599 0.045994194
600 0.192951667
601 0.137187646
602 0.038382245
603 0.094533104
604 0.043465244
605 0.105367155
606 0.037176733
607 0.038710875
608 0.027422592
609 0.018813264
610 0.033795138
611 0.106680229
612 0.048621731
613 0.05006327
614 0.070148294
615 0.05785681
616 0.010520682
617 0.047487753
618 0.079567571
619 0.076005496
620 0.07931119
621 0.07056221
622 0.055492454
623 0.055584922
624 0.045550241
625 0.024629715
626 0.153709977
627 0.046132503
628 0.09858467
629 0.042018334
630 0.025420034
631 0.061337615
632 0.061027257
633 0.050012263
634 0.021410851
635 0.034383224
636 0.307442127
637 0.144015143
638 0.036262961
639 0.020502476
640 0.121406556
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src='https://d3js.org/d3.v5.min.js'></script>
<script src="https://unpkg.com/[email protected]/dist/topojson.js"></script>
<style>
body { margin: 0; }
</style>
</head>
<body>
<div class='main'></div>
<script>
const margin = { top: 10, right: 30, bottom: 30, left: 30 };
const width = 960 - margin.left - margin.right;
const height = 500 - margin.top - margin.bottom;
const projection = d3.geoMercator()
.center([80, 25])
.scale(800)
.translate([width/2, height/2]);
const path = d3.geoPath()
.projection(projection);
const colourScale = d3.scaleQuantize()
.domain([0, 1])
.range(d3.schemeBlues[9]);
const $svg = d3.select('.main')
.append('svg')
.attr('width', width + margin.left + margin.right)
.attr('height', height + margin.top + margin.bottom);
const $g = $svg.append('g')
.attr('transform', `translate(${margin.left}, ${margin.top})`);
function setupChart(data) {
const [stateGeoData, districtGeoData, religionData] = data;
const boundary = topojson.mesh(stateGeoData, stateGeoData.objects.india, function(a, b) { return a === b; });
// district polygons
const $district = $g.append('g')
.attr('class', 'districts')
.selectAll('path')
.data(topojson.feature(districtGeoData, districtGeoData.objects.india_district).features)
.enter()
.append('path')
.attr('d', path)
.attr('class', 'district')
.attr('id', d => d.properties.DISTRICT)
.attr('stroke-width', 0.5)
.attr('stroke', '#dcdcdc')
.attr('fill', 'none');
$district
.attr('fill', d => {
// look up district
let district = religionData.filter( e => {
return e.dist_code == d.properties.censuscode ;
})
if (district.length == 0) {
return '#dcdcdc';
} else {
return colourScale(district[0]["muslim_pc"]);
}
});
// state polygons
$g.append('g')
.attr('class', 'states')
.selectAll('path')
.data(topojson.feature(stateGeoData, stateGeoData.objects.india).features)
.enter()
.append('path')
.attr('d', path)
.attr('stroke', '#888')
.attr('fill', 'none');
// country outer boundary
$g.append('path')
.datum(boundary)
.attr('d', path)
.attr('class', 'boundary')
.attr('stroke', '#000')
.attr('fill', 'none');
}
function init() {
const p = [loadStateGeoData(), loadDistrictGeoData(), loadReligionData()];
Promise.all(p)
.then(setupChart)
.catch(console.error);
}
function loadStateGeoData() {
return new Promise((resolve, reject) => {
d3.json('india_states.json')
.then(resolve)
.catch(reject);
});
}
function loadDistrictGeoData() {
return new Promise((resolve, reject) => {
d3.json('india_districts.json')
.then(resolve)
.catch(reject);
});
}
function loadReligionData() {
return new Promise((resolve, reject) => {
d3.csv('data.csv', d => ({
dist_code: d.dist_code,
muslim_pc: +d.muslim_pc
}))
.then(resolve)
.catch(reject);
});
}
init();
</script>
</body>
Display the source blob
Display the rendered blob
Raw
india_districts.json
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
india_states.json
Loading
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