Combining d3-brush and d3-zoom to implement Focus + Context. Another approach is to zoom to the brushed region.
-
-
Save fbreitwieser/2ca174f518c92623d379aa878a9d2911 to your computer and use it in GitHub Desktop.
Brush & Zoom
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
license: gpl-3.0 |
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
position | percent_covered | |
---|---|---|
0 | 29.2714 | |
2388 | 5.69514 | |
4776 | 10.0921 | |
7164 | 12.6047 | |
9552 | 6.36516 | |
11940 | 14.6985 | |
14328 | 7.07705 | |
16716 | 28.9782 | |
19104 | 28.727 | |
21492 | 15.5779 | |
23880 | 21.7755 | |
26268 | 20.938 | |
28656 | 18.4255 | |
31044 | 0 | |
33432 | 19.263 | |
35820 | 20.8543 | |
38208 | 6.28141 | |
40596 | 19.8911 | |
42984 | 9.54774 | |
45372 | 24.33 | |
47760 | 31.7839 | |
50148 | 5.82077 | |
52536 | 7.20268 | |
54924 | 19.1792 | |
57312 | 5.44389 | |
59700 | 18.593 | |
62088 | 12.9816 | |
64476 | 11.0553 | |
66864 | 22.2362 | |
69252 | 18.8861 | |
71640 | 23.5343 | |
74028 | 4.52261 | |
76416 | 16.9598 | |
78804 | 12.5209 | |
81192 | 17.9648 | |
83580 | 10.0503 | |
85968 | 15.5779 | |
88356 | 18.3417 | |
90744 | 26.1725 | |
93132 | 5.10888 | |
95520 | 17.0017 | |
97908 | 6.36516 | |
100296 | 10.7621 | |
102684 | 9.63149 | |
105072 | 13.6516 | |
107460 | 19.2211 | |
109848 | 6.36516 | |
112236 | 17.6717 | |
114624 | 16.3735 | |
117012 | 15.7454 | |
119400 | 21.3149 | |
121788 | 8.96147 | |
124176 | 12.3953 | |
126564 | 26.6332 | |
128952 | 6.36516 | |
131340 | 5.52764 | |
133728 | 7.70519 | |
136116 | 6.32328 | |
138504 | 10.6784 | |
140892 | 35.5528 | |
143280 | 15.201 | |
145668 | 0 | |
148056 | 6.36516 | |
150444 | 5.77889 | |
152832 | 14.7404 | |
155220 | 16.0804 | |
157608 | 6.36516 | |
159996 | 21.3568 | |
162384 | 0 | |
164772 | 6.15578 | |
167160 | 18.258 | |
169548 | 22.3199 | |
171936 | 0 | |
174324 | 16.6667 | |
176712 | 15.9548 | |
179100 | 12.1859 | |
181488 | 15.9548 | |
183876 | 5.48576 | |
186264 | 10.8459 | |
188652 | 0 | |
191040 | 6.36516 | |
193428 | 9.67337 | |
195816 | 13.0653 | |
198204 | 0 | |
200592 | 9.33836 | |
202980 | 17.6298 | |
205368 | 0 | |
207756 | 11.4322 | |
210144 | 24.3719 | |
212532 | 19.8492 | |
214920 | 15.0754 | |
217308 | 15.0754 | |
219696 | 0 | |
222084 | 17.2111 | |
224472 | 7.53769 | |
226860 | 8.58459 | |
229248 | 19.0536 | |
231636 | 35.8878 | |
234024 | 10.3853 | |
236412 | 12.6047 | |
238800 | 14.6147 | |
241188 | 2.05193 | |
243576 | 6.28141 | |
245964 | 18.0905 | |
248352 | 0 | |
250740 | 6.36516 | |
253128 | 15.4523 | |
255516 | 6.36516 | |
257904 | 12.4372 | |
260292 | 13.9028 | |
262680 | 24.6231 | |
265068 | 12.3116 | |
267456 | 12.3953 | |
269844 | 10.134 | |
272232 | 33.9196 | |
274620 | 0 | |
277008 | 0 | |
279396 | 0 | |
281784 | 5.27638 | |
284172 | 10.6784 | |
286560 | 18.4673 | |
288948 | 12.0603 | |
291336 | 0 | |
293724 | 11.8928 | |
296112 | 16.4573 | |
298500 | 14.1541 | |
300888 | 6.36516 | |
303276 | 11.1809 | |
305664 | 5.48576 | |
308052 | 25.1675 | |
310440 | 8.62647 | |
312828 | 18.8861 | |
315216 | 23.2412 | |
317604 | 6.36516 | |
319992 | 0 | |
322380 | 10.5109 | |
324768 | 13.3585 | |
327156 | 13.6097 | |
329544 | 4.39698 | |
331932 | 18.5092 | |
334320 | 32.1608 | |
336708 | 16.1642 | |
339096 | 16.9598 | |
341484 | 16.9179 | |
343872 | 14.2797 | |
346260 | 7.66332 | |
348648 | 12.6047 | |
351036 | 13.1072 | |
353424 | 27.9732 | |
355812 | 8.62647 | |
358200 | 25.0838 | |
360588 | 11.0972 | |
362976 | 7.99832 | |
365364 | 19.3049 | |
367752 | 2.42881 | |
370140 | 3.89447 | |
372528 | 22.2362 | |
374916 | 24.1625 | |
377304 | 12.5628 | |
379692 | 23.7018 | |
382080 | 24.2044 | |
384468 | 34.1709 | |
386856 | 21.7337 | |
389244 | 0.837521 | |
391632 | 22.5293 | |
394020 | 17.1692 | |
396408 | 10.0084 | |
398796 | 15.0335 | |
401184 | 13.3166 | |
403572 | 3.97822 | |
405960 | 5.02513 | |
408348 | 6.36516 | |
410736 | 6.23953 | |
413124 | 10.3015 | |
415512 | 15.6616 | |
417900 | 16.7504 | |
420288 | 10.4271 | |
422676 | 25.4188 | |
425064 | 3.93635 | |
427452 | 17.4204 | |
429840 | 24.0787 | |
432228 | 4.94137 | |
434616 | 6.32328 | |
437004 | 12.6466 | |
439392 | 16.9598 | |
441780 | 16.6667 | |
444168 | 9.42211 | |
446556 | 6.32328 | |
448944 | 24.2881 | |
451332 | 22.5293 | |
453720 | 23.1156 | |
456108 | 12.4791 | |
458496 | 6.15578 | |
460884 | 20.5611 | |
463272 | 29.3132 | |
465660 | 6.36516 | |
468048 | 0 | |
470436 | 18.928 | |
472824 | 8.58459 | |
475212 | 0 | |
477600 | 21.8593 | |
479988 | 10.1759 | |
482376 | 0 | |
484764 | 12.0603 | |
487152 | 12.8141 | |
489540 | 23.8693 | |
491928 | 8.37521 | |
494316 | 6.36516 | |
496704 | 12.3953 | |
499092 | 24.3719 | |
501480 | 12.6466 | |
503868 | 22.8643 | |
506256 | 29.1457 | |
508644 | 19.3467 | |
511032 | 14.3216 | |
513420 | 21.3568 | |
515808 | 12.9816 | |
518196 | 27.2194 | |
520584 | 30.6951 | |
522972 | 21.6499 | |
525360 | 13.191 | |
527748 | 22.8643 | |
530136 | 10.7621 | |
532524 | 30.8208 | |
534912 | 6.49079 | |
537300 | 17.2529 | |
539688 | 10.2178 | |
542076 | 0.20938 | |
544464 | 8.12395 | |
546852 | 10.3853 | |
549240 | 18.0905 | |
551628 | 18.7186 | |
554016 | 12.2697 | |
556404 | 5.48576 | |
558792 | 11.8509 | |
561180 | 0 | |
563568 | 6.36516 | |
565956 | 12.6047 | |
568344 | 23.325 | |
570732 | 38.5678 | |
573120 | 12.3534 | |
575508 | 11.7253 | |
577896 | 5.69514 | |
580284 | 15.4523 | |
582672 | 0 | |
585060 | 18.0067 | |
587448 | 16.0385 | |
589836 | 6.8258 | |
592224 | 20.0168 | |
594612 | 28.4757 | |
597000 | 12.1441 | |
599388 | 12.6884 | |
601776 | 14.7822 | |
604164 | 9.92462 | |
606552 | 12.5209 | |
608940 | 9.38023 | |
611328 | 19.0117 | |
613716 | 6.32328 | |
616104 | 14.6985 | |
618492 | 16.876 | |
620880 | 22.9062 | |
623268 | 10.5946 | |
625656 | 4.69012 | |
628044 | 10.5109 | |
630432 | 2.0938 | |
632820 | 18.928 | |
635208 | 4.48074 | |
637596 | 5.65327 | |
639984 | 28.6013 | |
642372 | 30.402 | |
644760 | 15.4523 | |
647148 | 11.7253 | |
649536 | 4.69012 | |
651924 | 6.32328 | |
654312 | 6.36516 | |
656700 | 6.32328 | |
659088 | 6.65829 | |
661476 | 16.6248 | |
663864 | 12.2697 | |
666252 | 6.19765 | |
668640 | 8.71022 | |
671028 | 12.5628 | |
673416 | 14.6566 | |
675804 | 11.2647 | |
678192 | 5.9464 | |
680580 | 0 | |
682968 | 26.5913 | |
685356 | 5.69514 | |
687744 | 17.6717 | |
690132 | 20.1843 | |
692520 | 18.2161 | |
694908 | 22.6968 | |
697296 | 6.36516 | |
699684 | 19.2211 | |
702072 | 17.4204 | |
704460 | 25.9213 | |
706848 | 0.293132 | |
709236 | 26.5494 | |
711624 | 24.0787 | |
714012 | 19.3049 | |
716400 | 6.28141 | |
718788 | 4.64824 | |
721176 | 12.8978 | |
723564 | 6.36516 | |
725952 | 12.8559 | |
728340 | 19.8911 | |
730728 | 16.1642 | |
733116 | 15.2848 | |
735504 | 17.0854 | |
737892 | 9.75712 | |
740280 | 17.4623 | |
742668 | 17.6298 | |
745056 | 18.8861 | |
747444 | 0 | |
749832 | 10.2178 | |
752220 | 6.32328 | |
754608 | 14.6985 | |
756996 | 14.2797 | |
759384 | 17.5042 | |
761772 | 10.0084 | |
764160 | 8.12395 | |
766548 | 8.37521 | |
768936 | 10.0084 | |
771324 | 7.78894 | |
773712 | 23.1993 | |
776100 | 15.1173 | |
778488 | 0 | |
780876 | 19.0117 | |
783264 | 9.46399 | |
785652 | 3.18258 | |
788040 | 11.7672 | |
790428 | 11.809 | |
792816 | 11.3065 | |
795204 | 17.2948 | |
797592 | 6.19765 | |
799980 | 6.32328 | |
802368 | 12.6884 | |
804756 | 0 | |
807144 | 14.4054 | |
809532 | 9.88275 | |
811920 | 8.66834 | |
814308 | 25.4606 | |
816696 | 0 | |
819084 | 15.201 | |
821472 | 0 | |
823860 | 11.3903 | |
826248 | 15.9129 | |
828636 | 15.0335 | |
831024 | 5.10888 | |
833412 | 18.9698 | |
835800 | 30.6114 | |
838188 | 16.4573 | |
840576 | 0 | |
842964 | 0 | |
845352 | 19.3467 | |
847740 | 13.5678 | |
850128 | 0 | |
852516 | 21.6918 | |
854904 | 22.9481 | |
857292 | 21.0637 | |
859680 | 0 | |
862068 | 17.2111 | |
864456 | 4.64824 | |
866844 | 10.134 | |
869232 | 25.1256 | |
871620 | 5.27638 | |
874008 | 12.6466 | |
876396 | 13.4841 | |
878784 | 13.6935 | |
881172 | 11.0972 | |
883560 | 17.2111 | |
885948 | 15.4941 | |
888336 | 17.5461 | |
890724 | 3.8526 | |
893112 | 8.75209 | |
895500 | 11.0134 | |
897888 | 18.593 | |
900276 | 24.9581 | |
902664 | 2.59631 | |
905052 | 15.9548 | |
907440 | 6.32328 | |
909828 | 11.2228 | |
912216 | 10.8878 | |
914604 | 21.9849 | |
916992 | 24.5812 | |
919380 | 12.2278 | |
921768 | 17.1692 | |
924156 | 17.0854 | |
926544 | 10.0921 | |
928932 | 22.1524 | |
931320 | 14.7822 | |
933708 | 36.0553 | |
936096 | 20.268 | |
938484 | 15.1173 | |
940872 | 18.7186 | |
943260 | 10.5946 | |
945648 | 6.36516 | |
948036 | 12.6047 | |
950424 | 12.6047 | |
952812 | 11.1809 | |
955200 | 19.6399 | |
957588 | 21.0637 | |
959976 | 15.7873 | |
962364 | 17.9229 | |
964752 | 0 | |
967140 | 6.36516 | |
969528 | 10.0503 | |
971916 | 5.73702 | |
974304 | 12.1859 | |
976692 | 22.6968 | |
979080 | 7.37018 | |
981468 | 17.6717 | |
983856 | 14.7404 | |
986244 | 15.0754 | |
988632 | 12.6466 | |
991020 | 11.0972 | |
993408 | 17.2529 | |
995796 | 7.8727 | |
998184 | 0 | |
1000572 | 23.1993 | |
1002960 | 12.7303 | |
1005348 | 11.8509 | |
1007736 | 10.2596 | |
1010124 | 12.2697 | |
1012512 | 15.1173 | |
1014900 | 21.8174 | |
1017288 | 16.4992 | |
1019676 | 19.2211 | |
1022064 | 15.7454 | |
1024452 | 6.32328 | |
1026840 | 11.2647 | |
1029228 | 18.2998 | |
1031616 | 6.32328 | |
1034004 | 16.0385 | |
1036392 | 0 | |
1038780 | 10.0921 | |
1041168 | 8.83585 | |
1043556 | 6.32328 | |
1045944 | 0 | |
1048332 | 0 | |
1050720 | 0 | |
1053108 | 0 | |
1055496 | 9.9665 | |
1057884 | 15.9129 | |
1060272 | 6.15578 | |
1062660 | 17.5879 | |
1065048 | 27.6801 | |
1067436 | 0 | |
1069824 | 29.1039 | |
1072212 | 5.77889 | |
1074600 | 8.75209 | |
1076988 | 7.11893 | |
1079376 | 8.75209 | |
1081764 | 0 | |
1084152 | 0 | |
1086540 | 4.31323 | |
1088928 | 28.6432 | |
1091316 | 9.84087 | |
1093704 | 8.33333 | |
1096092 | 11.809 | |
1098480 | 26.9263 | |
1100868 | 5.86265 | |
1103256 | 0 | |
1105644 | 8.9196 | |
1108032 | 23.9531 | |
1110420 | 6.28141 | |
1112808 | 22.1524 | |
1115196 | 25.0419 | |
1117584 | 9.46399 | |
1119972 | 6.28141 | |
1122360 | 16.2479 | |
1124748 | 30.6951 | |
1127136 | 21.3568 | |
1129524 | 0 | |
1131912 | 12.4372 | |
1134300 | 23.66 | |
1136688 | 14.1541 | |
1139076 | 10.9715 | |
1141464 | 0 | |
1143852 | 6.28141 | |
1146240 | 12.5628 | |
1148628 | 21.0218 | |
1151016 | 15.1591 | |
1153404 | 10.5528 | |
1155792 | 17.0854 | |
1158180 | 12.3116 | |
1160568 | 21.5243 | |
1162956 | 4.48074 | |
1165344 | 14.9497 | |
1167732 | 0 | |
1170120 | 0 | |
1172508 | 11.7672 | |
1174896 | 23.5343 | |
1177284 | 11.2228 | |
1179672 | 10.7203 | |
1182060 | 6.28141 | |
1184448 | 13.6935 | |
1186836 | 30.4439 | |
1189224 | 18.258 | |
1191612 | 27.1357 | |
1194000 | 6.19765 | |
1196388 | 19.933 | |
1198776 | 9.50586 | |
1201164 | 14.6566 | |
1203552 | 15.7454 | |
1205940 | 23.0318 | |
1208328 | 10.4271 | |
1210716 | 14.4891 | |
1213104 | 8.79397 | |
1215492 | 0 | |
1217880 | 0 | |
1220268 | 0 | |
1222656 | 0 | |
1225044 | 26.4238 | |
1227432 | 23.5343 | |
1229820 | 27.0101 | |
1232208 | 12.5628 | |
1234596 | 13.4422 | |
1236984 | 16.5829 | |
1239372 | 0 | |
1241760 | 0 | |
1244148 | 16.3317 | |
1246536 | 24.1206 | |
1248924 | 4.85762 | |
1251312 | 9.71524 | |
1253700 | 19.8074 | |
1256088 | 17.5879 | |
1258476 | 1.00503 | |
1260864 | 16.1223 | |
1263252 | 12.4372 | |
1265640 | 0 | |
1268028 | 6.15578 | |
1270416 | 5.40201 | |
1272804 | 7.28643 | |
1275192 | 0 | |
1277580 | 15.7873 | |
1279968 | 15.7035 | |
1282356 | 9.67337 | |
1284744 | 6.28141 | |
1287132 | 6.23953 | |
1289520 | 16.876 | |
1291908 | 22.3618 | |
1294296 | 24.2462 | |
1296684 | 0 | |
1299072 | 12.5628 | |
1301460 | 0 | |
1303848 | 4.60637 | |
1306236 | 22.2781 | |
1308624 | 6.15578 | |
1311012 | 12.3116 | |
1313400 | 0 | |
1315788 | 0 | |
1318176 | 0 | |
1320564 | 4.73199 | |
1322952 | 1.38191 | |
1325340 | 18.8861 | |
1327728 | 23.1156 | |
1330116 | 11.139 | |
1332504 | 8.37521 | |
1334892 | 12.6466 | |
1337280 | 10.804 | |
1339668 | 9.54774 | |
1342056 | 23.1156 | |
1344444 | 15.8291 | |
1346832 | 6.74204 | |
1349220 | 18.8861 | |
1351608 | 16.6667 | |
1353996 | 4.27136 | |
1356384 | 2.01005 | |
1358772 | 12.6047 | |
1361160 | 13.7772 | |
1363548 | 7.99832 | |
1365936 | 7.37018 | |
1368324 | 17.5879 | |
1370712 | 22.4037 | |
1373100 | 15.536 | |
1375488 | 12.5209 | |
1377876 | 3.8526 | |
1380264 | 9.92462 | |
1382652 | 11.5159 | |
1385040 | 14.9916 | |
1387428 | 12.5628 | |
1389816 | 0 | |
1392204 | 0 | |
1394592 | 14.5729 | |
1396980 | 3.18258 | |
1399368 | 12.4791 | |
1401756 | 12.3116 | |
1404144 | 10.9715 | |
1406532 | 16.876 | |
1408920 | 17.6298 | |
1411308 | 6.19765 | |
1413696 | 4.27136 | |
1416084 | 0 | |
1418472 | 6.36516 | |
1420860 | 4.22948 | |
1423248 | 17.2948 | |
1425636 | 19.0117 | |
1428024 | 15.9966 | |
1430412 | 15.201 | |
1432800 | 6.32328 | |
1435188 | 11.9765 | |
1437576 | 21.0218 | |
1439964 | 17.7973 | |
1442352 | 9.50586 | |
1444740 | 28.057 | |
1447128 | 8.24958 | |
1449516 | 17.1273 | |
1451904 | 13.861 | |
1454292 | 15.4104 | |
1456680 | 11.0553 | |
1459068 | 23.1156 | |
1461456 | 16.7085 | |
1463844 | 10.4271 | |
1466232 | 15.9548 | |
1468620 | 5.86265 | |
1471008 | 22.0687 | |
1473396 | 18.0486 | |
1475784 | 11.474 | |
1478172 | 18.7605 | |
1480560 | 18.3417 | |
1482948 | 4.43886 | |
1485336 | 15.2848 | |
1487724 | 20.938 | |
1490112 | 12.7722 | |
1492500 | 0 | |
1494888 | 0 | |
1497276 | 4.69012 | |
1499664 | 6.32328 | |
1502052 | 13.1072 | |
1504440 | 0 | |
1506828 | 0 | |
1509216 | 0 | |
1511604 | 0 | |
1513992 | 0 | |
1516380 | 0 | |
1518768 | 4.48074 | |
1521156 | 0 | |
1523544 | 0 | |
1525932 | 0 | |
1528320 | 0 | |
1530708 | 12.3953 | |
1533096 | 12.6466 | |
1535484 | 20.8543 | |
1537872 | 16.7504 | |
1540260 | 10.6784 | |
1542648 | 18.593 | |
1545036 | 22.1524 | |
1547424 | 5.73702 | |
1549812 | 9.92462 | |
1552200 | 17.7136 | |
1554588 | 3.68509 | |
1556976 | 22.1943 | |
1559364 | 29.1039 | |
1561752 | 15.6616 | |
1564140 | 22.0268 | |
1566528 | 5.31826 | |
1568916 | 21.1055 | |
1571304 | 12.6047 | |
1573692 | 0 | |
1576080 | 23.66 | |
1578468 | 0 | |
1580856 | 12.6466 | |
1583244 | 16.0385 | |
1585632 | 12.6884 | |
1588020 | 9.84087 | |
1590408 | 14.6566 | |
1592796 | 12.9397 | |
1595184 | 18.8442 | |
1597572 | 9.04523 | |
1599960 | 8.54271 | |
1602348 | 10.804 | |
1604736 | 15.6616 | |
1607124 | 0 | |
1609512 | 2.47069 | |
1611900 | 15.4941 | |
1614288 | 14.1122 | |
1616676 | 16.8342 | |
1619064 | 18.2161 | |
1621452 | 6.15578 | |
1623840 | 8.79397 | |
1626228 | 4.77387 | |
1628616 | 17.9648 | |
1631004 | 10.3853 | |
1633392 | 14.531 | |
1635780 | 29.732 | |
1638168 | 10.3015 | |
1640556 | 18.3417 | |
1642944 | 16.3735 | |
1645332 | 8.41709 | |
1647720 | 6.32328 | |
1650108 | 0 | |
1652496 | 0 | |
1654884 | 0 | |
1657272 | 3.1407 | |
1659660 | 0 | |
1662048 | 10.9715 | |
1664436 | 0 | |
1666824 | 0 | |
1669212 | 6.32328 | |
1671600 | 7.07705 | |
1673988 | 9.25461 | |
1676376 | 9.50586 | |
1678764 | 0 | |
1681152 | 6.32328 | |
1683540 | 16.7923 | |
1685928 | 12.2697 | |
1688316 | 19.8492 | |
1690704 | 0 | |
1693092 | 13.9866 | |
1695480 | 8.66834 | |
1697868 | 10.9296 | |
1700256 | 8.54271 | |
1702644 | 18.2998 | |
1705032 | 0 | |
1707420 | 18.6348 | |
1709808 | 18.928 | |
1712196 | 12.6884 | |
1714584 | 3.26633 | |
1716972 | 13.9447 | |
1719360 | 18.9698 | |
1721748 | 10.0921 | |
1724136 | 13.191 | |
1726524 | 13.4841 | |
1728912 | 12.6884 | |
1731300 | 12.1441 | |
1733688 | 11.2228 | |
1736076 | 19.3049 | |
1738464 | 6.19765 | |
1740852 | 14.9916 | |
1743240 | 20.4774 | |
1745628 | 3.18258 | |
1748016 | 11.2228 | |
1750404 | 17.8392 | |
1752792 | 5.44389 | |
1755180 | 3.89447 | |
1757568 | 14.3635 | |
1759956 | 17.6298 | |
1762344 | 6.32328 | |
1764732 | 16.0385 | |
1767120 | 22.7806 | |
1769508 | 10.804 | |
1771896 | 2.51256 | |
1774284 | 0 | |
1776672 | 17.9648 | |
1779060 | 10.469 | |
1781448 | 5.82077 | |
1783836 | 12.0184 | |
1786224 | 19.5561 | |
1788612 | 7.91457 | |
1791000 | 4.52261 | |
1793388 | 12.0603 | |
1795776 | 22.6968 | |
1798164 | 11.3065 | |
1800552 | 6.28141 | |
1802940 | 9.58961 | |
1805328 | 12.6047 | |
1807716 | 24.4975 | |
1810104 | 13.1072 | |
1812492 | 5.48576 | |
1814880 | 6.36516 | |
1817268 | 4.98325 | |
1819656 | 10.7621 | |
1822044 | 12.6884 | |
1824432 | 17.9229 | |
1826820 | 5.56951 | |
1829208 | 3.35008 | |
1831596 | 11.3484 | |
1833984 | 12.5209 | |
1836372 | 22.4456 | |
1838760 | 3.1407 | |
1841148 | 9.84087 | |
1843536 | 5.56951 | |
1845924 | 15.536 | |
1848312 | 7.49581 | |
1850700 | 12.6466 | |
1853088 | 12.1441 | |
1855476 | 11.139 | |
1857864 | 9.67337 | |
1860252 | 16.6248 | |
1862640 | 12.0603 | |
1865028 | 5.02513 | |
1867416 | 6.36516 | |
1869804 | 0 | |
1872192 | 10.7621 | |
1874580 | 12.3116 | |
1876968 | 11.139 | |
1879356 | 16.2479 | |
1881744 | 25.67 | |
1884132 | 18.2998 | |
1886520 | 5.27638 | |
1888908 | 12.7303 | |
1891296 | 32.3702 | |
1893684 | 0 | |
1896072 | 34.7571 | |
1898460 | 6.36516 | |
1900848 | 18.7605 | |
1903236 | 31.742 | |
1905624 | 10.7203 | |
1908012 | 16.7085 | |
1910400 | 6.32328 | |
1912788 | 23.0318 | |
1915176 | 11.4322 | |
1917564 | 9.54774 | |
1919952 | 11.5997 | |
1922340 | 0 | |
1924728 | 10.8459 | |
1927116 | 32.2446 | |
1929504 | 11.2647 | |
1931892 | 26.5075 | |
1934280 | 15.9966 | |
1936668 | 23.7856 | |
1939056 | 16.7504 | |
1941444 | 8.20771 | |
1943832 | 0 | |
1946220 | 15.2429 | |
1948608 | 13.3585 | |
1950996 | 12.6466 | |
1953384 | 11.5997 | |
1955772 | 8.16583 | |
1958160 | 24.1625 | |
1960548 | 11.3065 | |
1962936 | 15.8291 | |
1965324 | 12.6884 | |
1967712 | 16.6248 | |
1970100 | 28.8107 | |
1972488 | 12.7303 | |
1974876 | 15.0335 | |
1977264 | 12.6047 | |
1979652 | 11.2647 | |
1982040 | 6.28141 | |
1984428 | 12.2697 | |
1986816 | 19.0536 | |
1989204 | 6.32328 | |
1991592 | 10.7621 | |
1993980 | 20.1005 | |
1996368 | 10.3853 | |
1998756 | 22.0687 | |
2001144 | 13.2328 | |
2003532 | 25.4188 | |
2005920 | 6.32328 | |
2008308 | 0 | |
2010696 | 14.6147 | |
2013084 | 12.6884 | |
2015472 | 24.8744 | |
2017860 | 0 | |
2020248 | 10.5946 | |
2022636 | 18.9698 | |
2025024 | 10.469 | |
2027412 | 6.36516 | |
2029800 | 0 | |
2032188 | 12.3534 | |
2034576 | 29.8995 | |
2036964 | 27.4288 | |
2039352 | 3.72697 | |
2041740 | 13.6516 | |
2044128 | 17.6717 | |
2046516 | 9.42211 | |
2048904 | 24.4137 | |
2051292 | 6.19765 | |
2053680 | 9.63149 | |
2056068 | 18.7186 | |
2058456 | 12.6047 | |
2060844 | 6.36516 | |
2063232 | 17.2529 | |
2065620 | 3.18258 | |
2068008 | 19.3886 | |
2070396 | 0 | |
2072784 | 15.871 | |
2075172 | 6.03015 | |
2077560 | 5.19263 | |
2079948 | 10.5528 | |
2082336 | 0 | |
2084724 | 18.4673 | |
2087112 | 12.5628 | |
2089500 | 6.32328 | |
2091888 | 19.0117 | |
2094276 | 3.8526 | |
2096664 | 15.871 | |
2099052 | 4.43886 | |
2101440 | 23.325 | |
2103828 | 32.2446 | |
2106216 | 9.54774 | |
2108604 | 7.8727 | |
2110992 | 25.2094 | |
2113380 | 8.45896 | |
2115768 | 6.32328 | |
2118156 | 18.9698 | |
2120544 | 6.32328 | |
2122932 | 0 | |
2125320 | 27.0101 | |
2127708 | 4.48074 | |
2130096 | 18.928 | |
2132484 | 5.73702 | |
2134872 | 9.50586 | |
2137260 | 13.2328 | |
2139648 | 15.9548 | |
2142036 | 6.36516 | |
2144424 | 0 | |
2146812 | 5.56951 | |
2149200 | 8.45896 | |
2151588 | 17.8811 | |
2153976 | 11.5997 | |
2156364 | 12.2697 | |
2158752 | 18.6767 | |
2161140 | 23.9112 | |
2163528 | 24.0787 | |
2165916 | 9.42211 | |
2168304 | 12.4791 | |
2170692 | 17.8392 | |
2173080 | 20.2261 | |
2175468 | 9.04523 | |
2177856 | 22.4874 | |
2180244 | 9.63149 | |
2182632 | 19.6399 | |
2185020 | 6.32328 | |
2187408 | 0 | |
2189796 | 21.0637 | |
2192184 | 12.4791 | |
2194572 | 4.31323 | |
2196960 | 6.07203 | |
2199348 | 9.04523 | |
2201736 | 29.6482 | |
2204124 | 12.6884 | |
2206512 | 21.0218 | |
2208900 | 15.201 | |
2211288 | 6.36516 | |
2213676 | 11.0972 | |
2216064 | 6.32328 | |
2218452 | 15.2429 | |
2220840 | 18.7186 | |
2223228 | 15.3685 | |
2225616 | 0 | |
2228004 | 17.0854 | |
2230392 | 0 | |
2232780 | 2.9732 | |
2235168 | 4.73199 | |
2237556 | 3.18258 | |
2239944 | 19.0536 | |
2242332 | 16.0804 | |
2244720 | 10.5946 | |
2247108 | 6.23953 | |
2249496 | 22.2362 | |
2251884 | 10.7621 | |
2254272 | 6.28141 | |
2256660 | 12.4372 | |
2259048 | 11.8928 | |
2261436 | 13.8191 | |
2263824 | 10.134 | |
2266212 | 15.7454 | |
2268600 | 0 | |
2270988 | 4.8995 | |
2273376 | 0 | |
2275764 | 6.1139 | |
2278152 | 10.6784 | |
2280540 | 6.32328 | |
2282928 | 26.9682 | |
2285316 | 15.4523 | |
2287704 | 14.4472 | |
2290092 | 0 | |
2292480 | 0 | |
2294868 | 5.19263 | |
2297256 | 12.7303 | |
2299644 | 16.3317 | |
2302032 | 9.42211 | |
2304420 | 6.32328 | |
2306808 | 7.49581 | |
2309196 | 12.1441 | |
2311584 | 8.79397 | |
2313972 | 11.7253 | |
2316360 | 0 | |
2318748 | 30.5695 | |
2321136 | 17.5461 | |
2323524 | 23.9112 | |
2325912 | 6.28141 | |
2328300 | 12.6047 | |
2330688 | 0 | |
2333076 | 4.73199 | |
2335464 | 0 | |
2337852 | 12.6466 | |
2340240 | 17.4623 | |
2342628 | 12.6466 | |
2345016 | 30.1508 | |
2347404 | 0 | |
2349792 | 12.1441 | |
2352180 | 17.5042 | |
2354568 | 17.5461 | |
2356956 | 10.8459 | |
2359344 | 18.258 | |
2361732 | 23.3668 | |
2364120 | 0 | |
2366508 | 23.6181 | |
2368896 | 4.14573 | |
2371284 | 15.5779 | |
2373672 | 6.03015 | |
2376060 | 22.6131 | |
2378448 | 12.2697 | |
2380836 | 6.32328 | |
2383224 | 0 | |
2385612 | 0 |
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> | |
<meta charset="utf-8"> | |
<style> | |
.area { | |
fill: steelblue; | |
clip-path: url(#clip); | |
} | |
.zoom { | |
cursor: move; | |
fill: none; | |
pointer-events: all; | |
} | |
</style> | |
<svg width="960" height="500"></svg> | |
<script src="https://d3js.org/d3.v4.min.js"></script> | |
<script> | |
var svg = d3.select("svg"), | |
margin = {top: 20, right: 20, bottom: 110, left: 40}, | |
margin2 = {top: 430, right: 20, bottom: 30, left: 40}, | |
width = +svg.attr("width") - margin.left - margin.right, | |
height = +svg.attr("height") - margin.top - margin.bottom, | |
height2 = +svg.attr("height") - margin2.top - margin2.bottom; | |
var x = d3.scaleLinear().range([0, width]), | |
x2 = d3.scaleLinear().range([0, width]), | |
y = d3.scaleLinear().range([height, 0]), | |
y2 = d3.scaleLinear().range([height2, 0]); | |
var xAxis = d3.axisBottom(x), | |
xAxis2 = d3.axisBottom(x2), | |
yAxis = d3.axisLeft(y); | |
var brush = d3.brushX() | |
.extent([[0, 0], [width, height2]]) | |
.on("brush end", brushed); | |
var zoom = d3.zoom() | |
.scaleExtent([1, Infinity]) | |
.translateExtent([[0, 0], [width, height]]) | |
.extent([[0, 0], [width, height]]) | |
.on("zoom", zoomed); | |
var area = d3.area() | |
.curve(d3.curveMonotoneX) | |
.x(function(d) { return x(d.position); }) | |
.y0(height) | |
.y1(function(d) { return y(d.percent_covered); }); | |
var area2 = d3.area() | |
.curve(d3.curveMonotoneX) | |
.x(function(d) { return x2(d.position); }) | |
.y0(height2) | |
.y1(function(d) { return y2(d.percent_covered); }); | |
svg.append("defs").append("clipPath") | |
.attr("id", "clip") | |
.append("rect") | |
.attr("width", width) | |
.attr("height", height); | |
var focus = svg.append("g") | |
.attr("class", "focus") | |
.attr("transform", "translate(" + margin.left + "," + margin.top + ")"); | |
var context = svg.append("g") | |
.attr("class", "context") | |
.attr("transform", "translate(" + margin2.left + "," + margin2.top + ")"); | |
d3.csv("cov.csv", type, function(error, data) { | |
if (error) throw error; | |
x.domain(d3.extent(data, function(d) { return d.position; })); | |
y.domain([0, d3.max(data, function(d) { return d.percent_covered; })]); | |
x2.domain(x.domain()); | |
y2.domain(y.domain()); | |
focus.append("path") | |
.datum(data) | |
.attr("class", "area") | |
.attr("d", area); | |
focus.append("g") | |
.attr("class", "axis axis--x") | |
.attr("transform", "translate(0," + height + ")") | |
.call(xAxis); | |
focus.append("g") | |
.attr("class", "axis axis--y") | |
.call(yAxis); | |
context.append("path") | |
.datum(data) | |
.attr("class", "area") | |
.attr("d", area2); | |
context.append("g") | |
.attr("class", "axis axis--x") | |
.attr("transform", "translate(0," + height2 + ")") | |
.call(xAxis2); | |
context.append("g") | |
.attr("class", "brush") | |
.call(brush) | |
.call(brush.move, x.range()); | |
svg.append("rect") | |
.attr("class", "zoom") | |
.attr("width", width) | |
.attr("height", height) | |
.attr("transform", "translate(" + margin.left + "," + margin.top + ")") | |
.call(zoom); | |
}); | |
function brushed() { | |
if (d3.event.sourceEvent && d3.event.sourceEvent.type === "zoom") return; // ignore brush-by-zoom | |
var s = d3.event.selection || x2.range(); | |
x.domain(s.map(x2.invert, x2)); | |
focus.select(".area").attr("d", area); | |
focus.select(".axis--x").call(xAxis); | |
svg.select(".zoom").call(zoom.transform, d3.zoomIdentity | |
.scale(width / (s[1] - s[0])) | |
.translate(-s[0], 0)); | |
} | |
function zoomed() { | |
if (d3.event.sourceEvent && d3.event.sourceEvent.type === "brush") return; // ignore zoom-by-brush | |
var t = d3.event.transform; | |
x.domain(t.rescaleX(x2).domain()); | |
focus.select(".area").attr("d", area); | |
focus.select(".axis--x").call(xAxis); | |
context.select(".brush").call(brush.move, x.range().map(t.invertX, t)); | |
} | |
function type(d) { | |
d.position = +d.position; | |
d.percent_covered = +d.percent_covered; | |
return d; | |
} | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment