Last active
September 28, 2019 15:27
-
-
Save rlbarter/da4decacf20dda2d9274e6986f4a81a8 to your computer and use it in GitHub Desktop.
Burke Gilman Trail
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
| day_hour | date_group | day_hour_numeric | bikes_south | bikes_north | ||
|---|---|---|---|---|---|---|
| 1 | Mon 0:00 | 2017-01-02 00:00:00 | 1 | 0.458333333333333 | 0.354166666666667 | |
| 2 | Mon 1:00 | 2017-01-02 01:00:00 | 2 | 0.145833333333333 | 0.0416666666666667 | |
| 3 | Mon 2:00 | 2017-01-02 02:00:00 | 3 | 0.145833333333333 | 0.229166666666667 | |
| 4 | Mon 3:00 | 2017-01-02 03:00:00 | 4 | 0.25 | 0.541666666666667 | |
| 5 | Mon 4:00 | 2017-01-02 04:00:00 | 5 | 1.04166666666667 | 3.25 | |
| 6 | Mon 5:00 | 2017-01-02 05:00:00 | 6 | 2.97916666666667 | 10.3333333333333 | |
| 7 | Mon 6:00 | 2017-01-02 06:00:00 | 7 | 9.4375 | 30.0833333333333 | |
| 8 | Mon 7:00 | 2017-01-02 07:00:00 | 8 | 15.7083333333333 | 54.375 | |
| 9 | Mon 8:00 | 2017-01-02 08:00:00 | 9 | 22.9375 | 54.8958333333333 | |
| 10 | Mon 9:00 | 2017-01-02 09:00:00 | 10 | 26.8333333333333 | 32.0208333333333 | |
| 11 | Mon 10:00 | 2017-01-02 10:00:00 | 11 | 25.125 | 28.5416666666667 | |
| 12 | Mon 11:00 | 2017-01-02 11:00:00 | 12 | 25.1666666666667 | 27.1458333333333 | |
| 13 | Mon 12:00 | 2017-01-02 12:00:00 | 13 | 28.375 | 28.625 | |
| 14 | Mon 13:00 | 2017-01-02 13:00:00 | 14 | 30.125 | 28.8958333333333 | |
| 15 | Mon 14:00 | 2017-01-02 14:00:00 | 15 | 34.6875 | 31.5833333333333 | |
| 16 | Mon 15:00 | 2017-01-02 15:00:00 | 16 | 44.875 | 32.0208333333333 | |
| 17 | Mon 16:00 | 2017-01-02 16:00:00 | 17 | 65.1875 | 33.1666666666667 | |
| 18 | Mon 17:00 | 2017-01-02 17:00:00 | 18 | 88.1666666666667 | 36.9583333333333 | |
| 19 | Mon 18:00 | 2017-01-02 18:00:00 | 19 | 60.4166666666667 | 32.875 | |
| 20 | Mon 19:00 | 2017-01-02 19:00:00 | 20 | 27.7291666666667 | 20.0416666666667 | |
| 21 | Mon 20:00 | 2017-01-02 20:00:00 | 21 | 11.625 | 10.2916666666667 | |
| 22 | Mon 21:00 | 2017-01-02 21:00:00 | 22 | 3.75 | 3.77083333333333 | |
| 23 | Mon 22:00 | 2017-01-02 22:00:00 | 23 | 1.79166666666667 | 0.875 | |
| 24 | Mon 23:00 | 2017-01-02 23:00:00 | 24 | 0.520833333333333 | 0.291666666666667 | |
| 25 | Tue 0:00 | 2017-01-03 00:00:00 | 25 | 0.5 | 0.3125 | |
| 26 | Tue 1:00 | 2017-01-03 01:00:00 | 26 | 0.166666666666667 | 0.104166666666667 | |
| 27 | Tue 2:00 | 2017-01-03 02:00:00 | 27 | 0.270833333333333 | 0.104166666666667 | |
| 28 | Tue 3:00 | 2017-01-03 03:00:00 | 28 | 0.166666666666667 | 0.854166666666667 | |
| 29 | Tue 4:00 | 2017-01-03 04:00:00 | 29 | 1.125 | 3.875 | |
| 30 | Tue 5:00 | 2017-01-03 05:00:00 | 30 | 3.85416666666667 | 12.6875 | |
| 31 | Tue 6:00 | 2017-01-03 06:00:00 | 31 | 9.83333333333333 | 32.5 | |
| 32 | Tue 7:00 | 2017-01-03 07:00:00 | 32 | 16.625 | 60.125 | |
| 33 | Tue 8:00 | 2017-01-03 08:00:00 | 33 | 21.8125 | 55.6041666666667 | |
| 34 | Tue 9:00 | 2017-01-03 09:00:00 | 34 | 23.6458333333333 | 31.9583333333333 | |
| 35 | Tue 10:00 | 2017-01-03 10:00:00 | 35 | 22.3333333333333 | 22.5416666666667 | |
| 36 | Tue 11:00 | 2017-01-03 11:00:00 | 36 | 23.1666666666667 | 21.2708333333333 | |
| 37 | Tue 12:00 | 2017-01-03 12:00:00 | 37 | 21.2708333333333 | 24.5625 | |
| 38 | Tue 13:00 | 2017-01-03 13:00:00 | 38 | 24.7083333333333 | 23.1041666666667 | |
| 39 | Tue 14:00 | 2017-01-03 14:00:00 | 39 | 31.5833333333333 | 23.3333333333333 | |
| 40 | Tue 15:00 | 2017-01-03 15:00:00 | 40 | 39.625 | 27.5833333333333 | |
| 41 | Tue 16:00 | 2017-01-03 16:00:00 | 41 | 65.0416666666667 | 33.6458333333333 | |
| 42 | Tue 17:00 | 2017-01-03 17:00:00 | 42 | 90.375 | 38.2291666666667 | |
| 43 | Tue 18:00 | 2017-01-03 18:00:00 | 43 | 61.1666666666667 | 34.4791666666667 | |
| 44 | Tue 19:00 | 2017-01-03 19:00:00 | 44 | 28.0416666666667 | 20.1041666666667 | |
| 45 | Tue 20:00 | 2017-01-03 20:00:00 | 45 | 11.125 | 10.4375 | |
| 46 | Tue 21:00 | 2017-01-03 21:00:00 | 46 | 4.29166666666667 | 5.08333333333333 | |
| 47 | Tue 22:00 | 2017-01-03 22:00:00 | 47 | 2.20833333333333 | 1.1875 | |
| 48 | Tue 23:00 | 2017-01-03 23:00:00 | 48 | 1.9375 | 0.916666666666667 | |
| 49 | Wed 0:00 | 2017-01-04 00:00:00 | 49 | 0.604166666666667 | 0.145833333333333 | |
| 50 | Wed 1:00 | 2017-01-04 01:00:00 | 50 | 0.458333333333333 | 0.166666666666667 | |
| 51 | Wed 2:00 | 2017-01-04 02:00:00 | 51 | 1.02083333333333 | 0.0833333333333333 | |
| 52 | Wed 3:00 | 2017-01-04 03:00:00 | 52 | 0.166666666666667 | 0.625 | |
| 53 | Wed 4:00 | 2017-01-04 04:00:00 | 53 | 1.08333333333333 | 3.83333333333333 | |
| 54 | Wed 5:00 | 2017-01-04 05:00:00 | 54 | 3.4375 | 13.5833333333333 | |
| 55 | Wed 6:00 | 2017-01-04 06:00:00 | 55 | 10.4166666666667 | 33.8958333333333 | |
| 56 | Wed 7:00 | 2017-01-04 07:00:00 | 56 | 16.4791666666667 | 57.7916666666667 | |
| 57 | Wed 8:00 | 2017-01-04 08:00:00 | 57 | 21.3958333333333 | 56.375 | |
| 58 | Wed 9:00 | 2017-01-04 09:00:00 | 58 | 23.2083333333333 | 32.8958333333333 | |
| 59 | Wed 10:00 | 2017-01-04 10:00:00 | 59 | 20.875 | 21.6458333333333 | |
| 60 | Wed 11:00 | 2017-01-04 11:00:00 | 60 | 19.6875 | 22.3333333333333 | |
| 61 | Wed 12:00 | 2017-01-04 12:00:00 | 61 | 22.9791666666667 | 20.6875 | |
| 62 | Wed 13:00 | 2017-01-04 13:00:00 | 62 | 22.2083333333333 | 20.7916666666667 | |
| 63 | Wed 14:00 | 2017-01-04 14:00:00 | 63 | 30.6458333333333 | 23.2708333333333 | |
| 64 | Wed 15:00 | 2017-01-04 15:00:00 | 64 | 41.1666666666667 | 26.9375 | |
| 65 | Wed 16:00 | 2017-01-04 16:00:00 | 65 | 68.7708333333333 | 31.7083333333333 | |
| 66 | Wed 17:00 | 2017-01-04 17:00:00 | 66 | 91.25 | 38.3958333333333 | |
| 67 | Wed 18:00 | 2017-01-04 18:00:00 | 67 | 62.6041666666667 | 34.1458333333333 | |
| 68 | Wed 19:00 | 2017-01-04 19:00:00 | 68 | 27.875 | 21.5 | |
| 69 | Wed 20:00 | 2017-01-04 20:00:00 | 69 | 13.4166666666667 | 11.6875 | |
| 70 | Wed 21:00 | 2017-01-04 21:00:00 | 70 | 4.66666666666667 | 4.39583333333333 | |
| 71 | Wed 22:00 | 2017-01-04 22:00:00 | 71 | 2.375 | 1.77083333333333 | |
| 72 | Wed 23:00 | 2017-01-04 23:00:00 | 72 | 0.9375 | 0.4375 | |
| 73 | Thu 0:00 | 2017-01-05 00:00:00 | 73 | 0.375 | 0.0416666666666667 | |
| 74 | Thu 1:00 | 2017-01-05 01:00:00 | 74 | 0.395833333333333 | 0.145833333333333 | |
| 75 | Thu 2:00 | 2017-01-05 02:00:00 | 75 | 0.1875 | 0.1875 | |
| 76 | Thu 3:00 | 2017-01-05 03:00:00 | 76 | 0.208333333333333 | 0.6875 | |
| 77 | Thu 4:00 | 2017-01-05 04:00:00 | 77 | 1.0625 | 3.0625 | |
| 78 | Thu 5:00 | 2017-01-05 05:00:00 | 78 | 2.875 | 11.4166666666667 | |
| 79 | Thu 6:00 | 2017-01-05 06:00:00 | 79 | 9.6875 | 32.3333333333333 | |
| 80 | Thu 7:00 | 2017-01-05 07:00:00 | 80 | 15.25 | 52.375 | |
| 81 | Thu 8:00 | 2017-01-05 08:00:00 | 81 | 20.0625 | 51.0833333333333 | |
| 82 | Thu 9:00 | 2017-01-05 09:00:00 | 82 | 20.7083333333333 | 27.8541666666667 | |
| 83 | Thu 10:00 | 2017-01-05 10:00:00 | 83 | 16.1875 | 19.6666666666667 | |
| 84 | Thu 11:00 | 2017-01-05 11:00:00 | 84 | 18.6875 | 18.4583333333333 | |
| 85 | Thu 12:00 | 2017-01-05 12:00:00 | 85 | 19.3125 | 18.9375 | |
| 86 | Thu 13:00 | 2017-01-05 13:00:00 | 86 | 22.3541666666667 | 19.4166666666667 | |
| 87 | Thu 14:00 | 2017-01-05 14:00:00 | 87 | 27.7291666666667 | 19.9375 | |
| 88 | Thu 15:00 | 2017-01-05 15:00:00 | 88 | 36.1041666666667 | 24.2708333333333 | |
| 89 | Thu 16:00 | 2017-01-05 16:00:00 | 89 | 59.7708333333333 | 29.6666666666667 | |
| 90 | Thu 17:00 | 2017-01-05 17:00:00 | 90 | 81.125 | 34.3125 | |
| 91 | Thu 18:00 | 2017-01-05 18:00:00 | 91 | 56.9791666666667 | 31.7708333333333 | |
| 92 | Thu 19:00 | 2017-01-05 19:00:00 | 92 | 27 | 19.5625 | |
| 93 | Thu 20:00 | 2017-01-05 20:00:00 | 93 | 11.1666666666667 | 10.2083333333333 | |
| 94 | Thu 21:00 | 2017-01-05 21:00:00 | 94 | 5.02083333333333 | 4.04166666666667 | |
| 95 | Thu 22:00 | 2017-01-05 22:00:00 | 95 | 2.39583333333333 | 1.45833333333333 | |
| 96 | Thu 23:00 | 2017-01-05 23:00:00 | 96 | 1.125 | 0.3125 | |
| 97 | Fri 0:00 | 2017-01-06 00:00:00 | 97 | 0.583333333333333 | 0.125 | |
| 98 | Fri 1:00 | 2017-01-06 01:00:00 | 98 | 0.291666666666667 | 0.0833333333333333 | |
| 99 | Fri 2:00 | 2017-01-06 02:00:00 | 99 | 0.270833333333333 | 0.0625 | |
| 100 | Fri 3:00 | 2017-01-06 03:00:00 | 100 | 0.25 | 0.4375 | |
| 101 | Fri 4:00 | 2017-01-06 04:00:00 | 101 | 0.916666666666667 | 2.3125 | |
| 102 | Fri 5:00 | 2017-01-06 05:00:00 | 102 | 4.66666666666667 | 9.72916666666667 | |
| 103 | Fri 6:00 | 2017-01-06 06:00:00 | 103 | 25.625 | 31.9583333333333 | |
| 104 | Fri 7:00 | 2017-01-06 07:00:00 | 104 | 32.0416666666667 | 49.8958333333333 | |
| 105 | Fri 8:00 | 2017-01-06 08:00:00 | 105 | 21.5 | 45.8333333333333 | |
| 106 | Fri 9:00 | 2017-01-06 09:00:00 | 106 | 24.0833333333333 | 32.9166666666667 | |
| 107 | Fri 10:00 | 2017-01-06 10:00:00 | 107 | 21.9583333333333 | 25.7291666666667 | |
| 108 | Fri 11:00 | 2017-01-06 11:00:00 | 108 | 24.1041666666667 | 26.125 | |
| 109 | Fri 12:00 | 2017-01-06 12:00:00 | 109 | 25.5833333333333 | 26.0833333333333 | |
| 110 | Fri 13:00 | 2017-01-06 13:00:00 | 110 | 30.8333333333333 | 25.75 | |
| 111 | Fri 14:00 | 2017-01-06 14:00:00 | 111 | 37.9166666666667 | 27.6875 | |
| 112 | Fri 15:00 | 2017-01-06 15:00:00 | 112 | 47.6666666666667 | 32.1666666666667 | |
| 113 | Fri 16:00 | 2017-01-06 16:00:00 | 113 | 63.0625 | 37.25 | |
| 114 | Fri 17:00 | 2017-01-06 17:00:00 | 114 | 73.4166666666667 | 38.5 | |
| 115 | Fri 18:00 | 2017-01-06 18:00:00 | 115 | 48.2916666666667 | 29.7708333333333 | |
| 116 | Fri 19:00 | 2017-01-06 19:00:00 | 116 | 22.5 | 18.9375 | |
| 117 | Fri 20:00 | 2017-01-06 20:00:00 | 117 | 9.8125 | 8.95833333333333 | |
| 118 | Fri 21:00 | 2017-01-06 21:00:00 | 118 | 3.95833333333333 | 3.85416666666667 | |
| 119 | Fri 22:00 | 2017-01-06 22:00:00 | 119 | 2.3125 | 1.0625 | |
| 120 | Fri 23:00 | 2017-01-06 23:00:00 | 120 | 1.4375 | 0.979166666666667 | |
| 121 | Sat 0:00 | 2017-01-07 00:00:00 | 121 | 1 | 0.4375 | |
| 122 | Sat 1:00 | 2017-01-07 01:00:00 | 122 | 0.770833333333333 | 0.291666666666667 | |
| 123 | Sat 2:00 | 2017-01-07 02:00:00 | 123 | 0.25 | 0.166666666666667 | |
| 124 | Sat 3:00 | 2017-01-07 03:00:00 | 124 | 0.229166666666667 | 0.25 | |
| 125 | Sat 4:00 | 2017-01-07 04:00:00 | 125 | 0.729166666666667 | 0.270833333333333 | |
| 126 | Sat 5:00 | 2017-01-07 05:00:00 | 126 | 2.625 | 1.72916666666667 | |
| 127 | Sat 6:00 | 2017-01-07 06:00:00 | 127 | 10.3125 | 7.5 | |
| 128 | Sat 7:00 | 2017-01-07 07:00:00 | 128 | 23.3541666666667 | 15.1458333333333 | |
| 129 | Sat 8:00 | 2017-01-07 08:00:00 | 129 | 42.5833333333333 | 28.4375 | |
| 130 | Sat 9:00 | 2017-01-07 09:00:00 | 130 | 59.3125 | 39.4166666666667 | |
| 131 | Sat 10:00 | 2017-01-07 10:00:00 | 131 | 76.3541666666667 | 56.8958333333333 | |
| 132 | Sat 11:00 | 2017-01-07 11:00:00 | 132 | 79.4375 | 68.4583333333333 | |
| 133 | Sat 12:00 | 2017-01-07 12:00:00 | 133 | 73.4166666666667 | 72.5416666666667 | |
| 134 | Sat 13:00 | 2017-01-07 13:00:00 | 134 | 70.7916666666667 | 69.6875 | |
| 135 | Sat 14:00 | 2017-01-07 14:00:00 | 135 | 68.9375 | 72.7708333333333 | |
| 136 | Sat 15:00 | 2017-01-07 15:00:00 | 136 | 62.625 | 66.1458333333333 | |
| 137 | Sat 16:00 | 2017-01-07 16:00:00 | 137 | 47.3333333333333 | 57.8125 | |
| 138 | Sat 17:00 | 2017-01-07 17:00:00 | 138 | 30.3125 | 44.3333333333333 | |
| 139 | Sat 18:00 | 2017-01-07 18:00:00 | 139 | 21.875 | 29.5 | |
| 140 | Sat 19:00 | 2017-01-07 19:00:00 | 140 | 14.1458333333333 | 17.9791666666667 | |
| 141 | Sat 20:00 | 2017-01-07 20:00:00 | 141 | 7.5625 | 9.375 | |
| 142 | Sat 21:00 | 2017-01-07 21:00:00 | 142 | 3.375 | 4.29166666666667 | |
| 143 | Sat 22:00 | 2017-01-07 22:00:00 | 143 | 1.75 | 1.77083333333333 | |
| 144 | Sat 23:00 | 2017-01-07 23:00:00 | 144 | 1.54166666666667 | 1.14583333333333 | |
| 145 | Sun 0:00 | 2017-01-08 00:00:00 | 145 | 0.645833333333333 | 0.375 | |
| 146 | Sun 1:00 | 2017-01-08 01:00:00 | 146 | 0.340425531914894 | 0.319148936170213 | |
| 147 | Sun 2:00 | 2017-01-08 02:00:00 | 147 | 0.106382978723404 | 0.148936170212766 | |
| 148 | Sun 3:00 | 2017-01-08 03:00:00 | 148 | 0.276595744680851 | 0.127659574468085 | |
| 149 | Sun 4:00 | 2017-01-08 04:00:00 | 149 | 0.553191489361702 | 0.531914893617021 | |
| 150 | Sun 5:00 | 2017-01-08 05:00:00 | 150 | 1.70212765957447 | 1.46808510638298 | |
| 151 | Sun 6:00 | 2017-01-08 06:00:00 | 151 | 8.12765957446809 | 4.04255319148936 | |
| 152 | Sun 7:00 | 2017-01-08 07:00:00 | 152 | 20.1489361702128 | 11.0851063829787 | |
| 153 | Sun 8:00 | 2017-01-08 08:00:00 | 153 | 37.2978723404255 | 25.063829787234 | |
| 154 | Sun 9:00 | 2017-01-08 09:00:00 | 154 | 55.7446808510638 | 39 | |
| 155 | Sun 10:00 | 2017-01-08 10:00:00 | 155 | 69.6382978723404 | 52.3404255319149 | |
| 156 | Sun 11:00 | 2017-01-08 11:00:00 | 156 | 76.4468085106383 | 64.8936170212766 | |
| 157 | Sun 12:00 | 2017-01-08 12:00:00 | 157 | 74.063829787234 | 74.8723404255319 | |
| 158 | Sun 13:00 | 2017-01-08 13:00:00 | 158 | 73.3829787234042 | 74.7872340425532 | |
| 159 | Sun 14:00 | 2017-01-08 14:00:00 | 159 | 73.1489361702128 | 75.0851063829787 | |
| 160 | Sun 15:00 | 2017-01-08 15:00:00 | 160 | 64.7021276595745 | 67.7446808510638 | |
| 161 | Sun 16:00 | 2017-01-08 16:00:00 | 161 | 50.4255319148936 | 65.1489361702128 | |
| 162 | Sun 17:00 | 2017-01-08 17:00:00 | 162 | 35.3404255319149 | 45.0212765957447 | |
| 163 | Sun 18:00 | 2017-01-08 18:00:00 | 163 | 20.7659574468085 | 29.3617021276596 | |
| 164 | Sun 19:00 | 2017-01-08 19:00:00 | 164 | 11.8510638297872 | 16.8510638297872 | |
| 165 | Sun 20:00 | 2017-01-08 20:00:00 | 165 | 5.76595744680851 | 8.1063829787234 | |
| 166 | Sun 21:00 | 2017-01-08 21:00:00 | 166 | 1.85106382978723 | 3.12765957446809 | |
| 167 | Sun 22:00 | 2017-01-08 22:00:00 | 167 | 1.17021276595745 | 0.936170212765957 | |
| 168 | Sun 23:00 | 2017-01-08 23:00:00 | 168 | 0.595744680851064 | 0.659574468085106 |
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
| (function(global, factory) { | |
| typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("d3-scale")) : | |
| typeof define === "function" && define.amd ? define(["exports", "d3-scale"], factory) : | |
| (factory(global.d3 = global.d3 || {}, global.d3)); | |
| }(this, function(exports, d3Scale) { | |
| 'use strict'; | |
| function square(x) { | |
| return x * x; | |
| } | |
| function radial() { | |
| var linear = d3Scale.scaleLinear(); | |
| function scale(x) { | |
| return Math.sqrt(linear(x)); | |
| } | |
| scale.domain = function(_) { | |
| return arguments.length ? (linear.domain(_), scale) : linear.domain(); | |
| }; | |
| scale.nice = function(count) { | |
| return (linear.nice(count), scale); | |
| }; | |
| scale.range = function(_) { | |
| return arguments.length ? (linear.range(_.map(square)), scale) : linear.range().map(Math.sqrt); | |
| }; | |
| scale.ticks = linear.ticks; | |
| scale.tickFormat = linear.tickFormat; | |
| return scale; | |
| } | |
| exports.scaleRadial = radial; | |
| Object.defineProperty(exports, '__esModule', {value: true}); | |
| })); |
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> | |
| <head> | |
| <meta charset="utf-8"> | |
| <script src="https://d3js.org/d3.v4.min.js"></script> | |
| <script src="d3-scale-radial.js"></script> | |
| <style> | |
| text { | |
| font-size: 14px; | |
| font-family: avenir; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <script> | |
| var margin = {top: 20, right: 10, bottom: 20, left: 10}; | |
| var width = 990 - margin.left - margin.right, | |
| height = 600 - margin.top - margin.bottom; | |
| var svg = d3.select("body").append("svg") | |
| .attr("width", width + margin.left + margin.right) | |
| .attr("height", height + margin.top + margin.bottom) | |
| .append("g") | |
| .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); | |
| var g = svg.append("g") | |
| .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")"); | |
| var innerRadius = 100, | |
| outerRadius = Math.min(width, height) / 2 - 30; | |
| var parseTime = d3.timeParse("%Y-%m-%d %H:%M:%S"); | |
| formatDay = d3.timeFormat("%A"); | |
| formatHour = d3.timeFormat("%H"); | |
| formatDayHour = d3.timeFormat("%A %H:%M"); | |
| var fullCircle = 2 * Math.PI; | |
| var x = d3.scaleTime() | |
| .range([0, fullCircle]); | |
| var y = d3.scaleRadial() | |
| .range([innerRadius, outerRadius]); | |
| var linesouth = d3.lineRadial() | |
| .angle(function(d) { return x(d.date_group); }) | |
| .radius(function(d) { return y(d.bikes_south); }); | |
| var linenorth = d3.lineRadial() | |
| .angle(function(d) { return x(d.date_group); }) | |
| .radius(function(d) { return y(d.bikes_north); }); | |
| d3.csv("bg_trail.csv" ,function(d) { | |
| d.date_group = parseTime(d.date_group); | |
| d.bikes_south = +d.bikes_south; | |
| d.bikes_north = +d.bikes_north; | |
| return d; | |
| }, function(error, data) { | |
| if (error) throw error; | |
| var maxValue = Math.max(0, d3.max(data, function(d) { return d.bikes_north; })); | |
| var angleSlice = Math.PI * 2 / 7; | |
| var rScale = d3.scaleLinear() | |
| .range([0, outerRadius]) | |
| .domain([0, maxValue]); | |
| x.domain([d3.min(data, function(d) { return d.date_group; }), d3.max(data, function(d) { return d.date_group; })]); | |
| y.domain([0, d3.max(data, function(d) { return d.bikes_north; })]); | |
| var linePlotSouth = g.append("path") | |
| .datum(data) | |
| .attr("fill", "none") | |
| .attr("stroke", "#4099ff") | |
| .attr("stroke-width", 3) | |
| .attr("d", linesouth); | |
| var linePlotNorth = g.append("path") | |
| .datum(data) | |
| .attr("fill", "none") | |
| .attr("stroke", " #ffa640") | |
| .attr("stroke-width", 3) | |
| .attr("d", linenorth); | |
| var yAxis = g.append("g") | |
| .attr("text-anchor", "middle"); | |
| var yTick = yAxis | |
| .selectAll("g") | |
| .data(y.ticks(3)) | |
| .enter().append("g"); | |
| yTick.append("circle") | |
| .attr("fill", "none") | |
| .attr("stroke", "black") | |
| .attr("opacity", 0.2) | |
| .attr("r", y); | |
| yAxis.append("circle") | |
| .attr("fill", "none") | |
| .attr("stroke", "black") | |
| .attr("opacity", 0.2) | |
| .attr("r", function() { return y(y.domain()[0])}); | |
| var labels = yTick.append("text") | |
| .attr("y", function(d) { return -y(d); }) | |
| .attr("dy", "0.35em") | |
| .attr("fill", "none") | |
| .attr("stroke", "#fff") | |
| .attr("stroke-width", 5) | |
| .attr("stroke-linejoin", "round") | |
| .text(function(d) { return d; }); | |
| yTick.append("text") | |
| .attr("y", function(d) { return -y(d); }) | |
| .attr("dy", "0.35em") | |
| .text(function(d) { return d; }); | |
| var xAxisOuter = g.append("g"); | |
| var title = g.append("g") | |
| .attr("class", "title") | |
| .append("text") | |
| .attr("dy", "-2em") | |
| .attr("text-anchor", "middle") | |
| .text("Cyclists per hour") | |
| var subtitle = g.append("text") | |
| .attr("dy", "-0.8em") | |
| .attr("text-anchor", "middle") | |
| .attr("opacity", 0.6) | |
| .text("on Burke Gilman"); | |
| g.append("text") | |
| .attr("dy", "1.4em") | |
| .attr("dx", "2em") | |
| .attr("text-anchor", "middle") | |
| .attr("stroke", "#4099ff") | |
| .attr("opacity", 0.8) | |
| .text("South"); | |
| g.append("text") | |
| .attr("dy", "1.4em") | |
| .attr("dx", "-2em") | |
| .attr("text-anchor", "middle") | |
| .attr("stroke", "#ffa640") | |
| .attr("opacity", 0.8) | |
| .text("North"); | |
| g.append("text") | |
| .attr("dy", "1.4em") | |
| .attr("text-anchor", "middle") | |
| .attr("opacity", 0.8) | |
| .text("/"); | |
| var timedate = svg.selectAll("text").select("text1").data(data).enter(); | |
| timedate.append("text") | |
| .attr("y", height / 2 + 50) | |
| .attr("x", width / 2) | |
| .attr("text-anchor", "middle") | |
| .attr("opacity", 0) | |
| .text(function(d, i) { return formatDayHour(d.date_group); }) | |
| .style("font-size", "18px") | |
| .transition(0) | |
| .delay(function(d, i) { return i * 35000 / (7 * 24); }) | |
| .attr("opacity", 0.6) | |
| .transition(0) | |
| .attr("opacity", 0) | |
| .remove(); | |
| var days = svg.selectAll("text").select("text2") | |
| .data(["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]).enter(); | |
| days.append("text") | |
| .attr("text-anchor", "middle") | |
| .attr("opacity", 0.5) | |
| .text(function(d, i) { return d; }) | |
| .style("font-size", "22px") | |
| .attr("transform", function(d, i) { | |
| if (i >= 2 & i <= 4) { | |
| return "translate(" + (width / 2 + outerRadius * 1.1 * Math.cos(angleSlice * i - Math.PI / 2 + 2 * Math.PI / 14)) + ", " + | |
| (height / 2 + outerRadius * 1.1 * Math.sin(angleSlice * i - Math.PI / 2 + 2 * Math.PI / 14)) + ") rotate(" + (180 + i * 360 / 7 + 25 ) + ")" ; | |
| } else { | |
| return "translate(" + (width / 2 + outerRadius * 1.1 * Math.cos(angleSlice * i - Math.PI / 2 + 2 * Math.PI / 14)) + ", " + | |
| (height / 2 + outerRadius * 1.1 * Math.sin(angleSlice * i - Math.PI / 2 + 2 * Math.PI / 14)) + ") rotate(" + (i * 360 / 7 + 25 ) + ")" ; | |
| } | |
| }); | |
| // Long axis | |
| var vertline_data = [1, 2, 3, 4, 5, 6, 7]; | |
| var vertline = g.selectAll("vline") | |
| .data(vertline_data) | |
| .enter().append("line") | |
| .attr("x1", function(d, i) { return innerRadius * Math.cos(angleSlice * i - Math.PI / 2)}) | |
| .attr("y1", function(d, i) { return innerRadius * Math.sin(angleSlice * i - Math.PI / 2)}) | |
| .attr("x2", function(d, i) { return rScale(maxValue * 1.1) * Math.cos(angleSlice * i - Math.PI / 2)}) | |
| .attr("y2", function(d, i) { return rScale(maxValue * 1.1) * Math.sin(angleSlice * i - Math.PI / 2)}) | |
| .style("stroke", "grey") | |
| .style("stroke-width",".5px"); | |
| var lineLengthSouth = linePlotSouth.node().getTotalLength(); | |
| var lineLengthNorth = linePlotNorth.node().getTotalLength(); | |
| // point that follows path of lines | |
| // animate lines | |
| linePlotSouth | |
| .attr("stroke-dasharray", lineLengthSouth + " " + lineLengthSouth) | |
| .attr("stroke-dashoffset", lineLengthSouth) | |
| .transition() | |
| .duration(35000) | |
| .delay(0) | |
| .ease(d3.easeLinear) | |
| .attr("stroke-dashoffset", 0); | |
| linePlotNorth | |
| .attr("stroke-dasharray", lineLengthNorth + " " + lineLengthNorth) | |
| .attr("stroke-dashoffset", lineLengthNorth) | |
| .transition() | |
| .duration(35000) | |
| .delay(0) | |
| .ease(d3.easeLinear) | |
| .attr("stroke-dashoffset", 0); | |
| }); | |
| </script> | |
| </body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment