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 hidden or 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 hidden or 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 hidden or 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