PINKRAH/storm_centroid_shift.html at main · PinkrahNanaOfosuhene/PINKRAH · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
<!DOCTYPE html>
<html>
<head>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

        <script>
            L_NO_TOUCH = false;
            L_DISABLE_3D = false;
        </script>

    <style>html, body {width: 100%;height: 100%;margin: 0;padding: 0;}</style>
    <style>#map {position:absolute;top:0;bottom:0;right:0;left:0;}</style>
    <script src="https://cdn.jsdelivr.net/npm/leaflet@1.9.3/dist/leaflet.js"></script>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.9.3/dist/leaflet.css"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.0/css/all.min.css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.css"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/python-visualization/folium/folium/templates/leaflet.awesome.rotate.min.css"/>

            <meta name="viewport" content="width=device-width,
                initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
            <style>
                #map_8bd6259d59b32d933f413da6dc88ee0a {
                    position: relative;
                    width: 100.0%;
                    height: 100.0%;
                    left: 0.0%;
                    top: 0.0%;
                }
                .leaflet-container { font-size: 1rem; }
            </style>

</head>
<body>


            <div class="folium-map" id="map_8bd6259d59b32d933f413da6dc88ee0a" ></div>

</body>
<script>


            var map_8bd6259d59b32d933f413da6dc88ee0a = L.map(
                "map_8bd6259d59b32d933f413da6dc88ee0a",
                {
                    center: [39.5, -98.35],
                    crs: L.CRS.EPSG3857,
                    ...{
  "zoom": 4,
  "zoomControl": true,
  "preferCanvas": false,
}

                }
            );


            var tile_layer_ec83edd1d635d63db1546823be4793bb = L.tileLayer(
                "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
                {
  "minZoom": 0,
  "maxZoom": 19,
  "maxNativeZoom": 19,
  "noWrap": false,
  "attribution": "\u0026copy; \u003ca href=\"https://www.openstreetmap.org/copyright\"\u003eOpenStreetMap\u003c/a\u003e contributors",
  "subdomains": "abc",
  "detectRetina": false,
  "tms": false,
  "opacity": 1,
}

            );


            tile_layer_ec83edd1d635d63db1546823be4793bb.addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var marker_12b7226310bf341952c7f32d09410531 = L.marker(
                [37.55478104040213, -91.5659326969043],
                {
}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var icon_e876ac2b21e47270d371075755a8f4f3 = L.AwesomeMarkers.icon(
                {
  "markerColor": "blue",
  "iconColor": "white",
  "icon": "info-sign",
  "prefix": "glyphicon",
  "extraClasses": "fa-rotate-0",
}
            );


        var popup_8d2bab410809f80819999290315ca9b2 = L.popup({
  "maxWidth": "100%",
});


                var html_cb98b2d85f735c33cad4dfb546380d79 = $(`<div id="html_cb98b2d85f735c33cad4dfb546380d79" style="width: 100.0%; height: 100.0%;">Decade: 1980</div>`)[0];
                popup_8d2bab410809f80819999290315ca9b2.setContent(html_cb98b2d85f735c33cad4dfb546380d79);


        marker_12b7226310bf341952c7f32d09410531.bindPopup(popup_8d2bab410809f80819999290315ca9b2)
        ;


                marker_12b7226310bf341952c7f32d09410531.setIcon(icon_e876ac2b21e47270d371075755a8f4f3);


            var poly_line_0bfd38f483bb080bb791e4a55eab9ad6 = L.polyline(
                [[37.55478104040213, -91.5659326969043], [37.47519459676699, -91.46285097955302]],
                {"bubblingMouseEvents": true, "color": "red", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "red", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            poly_line_0bfd38f483bb080bb791e4a55eab9ad6.bindTooltip(
                `<div>
                     1980 ➔ 1990
                 </div>`,
                {
  "sticky": true,
}
            );


            var marker_070424ef1814b4c0e83e71eaed55246c = L.marker(
                [37.47519459676699, -91.46285097955302],
                {
}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var icon_520f2d32613cd7edc7d840e134e116e5 = L.AwesomeMarkers.icon(
                {
  "markerColor": "blue",
  "iconColor": "white",
  "icon": "info-sign",
  "prefix": "glyphicon",
  "extraClasses": "fa-rotate-0",
}
            );


        var popup_acce8ce335c8218683d807c130b622f6 = L.popup({
  "maxWidth": "100%",
});


                var html_9172e69f2082e927e627f240145a4e10 = $(`<div id="html_9172e69f2082e927e627f240145a4e10" style="width: 100.0%; height: 100.0%;">Decade: 1990</div>`)[0];
                popup_acce8ce335c8218683d807c130b622f6.setContent(html_9172e69f2082e927e627f240145a4e10);


        marker_070424ef1814b4c0e83e71eaed55246c.bindPopup(popup_acce8ce335c8218683d807c130b622f6)
        ;


                marker_070424ef1814b4c0e83e71eaed55246c.setIcon(icon_520f2d32613cd7edc7d840e134e116e5);


            var poly_line_d5075dae9ca52622a3f04463d8d83cf1 = L.polyline(
                [[37.47519459676699, -91.46285097955302], [38.035076439123344, -91.10942914749998]],
                {"bubblingMouseEvents": true, "color": "red", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "red", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            poly_line_d5075dae9ca52622a3f04463d8d83cf1.bindTooltip(
                `<div>
                     1990 ➔ 2000
                 </div>`,
                {
  "sticky": true,
}
            );


            var marker_e707fda09985cbdb998f017cad74b9d4 = L.marker(
                [38.035076439123344, -91.10942914749998],
                {
}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var icon_7b6f8c8d1a871d99a167d806cb4f420b = L.AwesomeMarkers.icon(
                {
  "markerColor": "blue",
  "iconColor": "white",
  "icon": "info-sign",
  "prefix": "glyphicon",
  "extraClasses": "fa-rotate-0",
}
            );


        var popup_d1a81a725009519aa31817fb31b4342e = L.popup({
  "maxWidth": "100%",
});


                var html_da218bd8ecf3f8b6d5c455ff07ba9936 = $(`<div id="html_da218bd8ecf3f8b6d5c455ff07ba9936" style="width: 100.0%; height: 100.0%;">Decade: 2000</div>`)[0];
                popup_d1a81a725009519aa31817fb31b4342e.setContent(html_da218bd8ecf3f8b6d5c455ff07ba9936);


        marker_e707fda09985cbdb998f017cad74b9d4.bindPopup(popup_d1a81a725009519aa31817fb31b4342e)
        ;


                marker_e707fda09985cbdb998f017cad74b9d4.setIcon(icon_7b6f8c8d1a871d99a167d806cb4f420b);


            var poly_line_048be6874c9df250a559514e71ec8cfa = L.polyline(
                [[38.035076439123344, -91.10942914749998], [37.89781572873332, -90.28823351822786]],
                {"bubblingMouseEvents": true, "color": "red", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "red", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            poly_line_048be6874c9df250a559514e71ec8cfa.bindTooltip(
                `<div>
                     2000 ➔ 2010
                 </div>`,
                {
  "sticky": true,
}
            );


            var marker_677fa774ef1615524ddf73e474ba8476 = L.marker(
                [37.89781572873332, -90.28823351822786],
                {
}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var icon_31cbbfbfabbc71c67e77295c3aea3bc4 = L.AwesomeMarkers.icon(
                {
  "markerColor": "blue",
  "iconColor": "white",
  "icon": "info-sign",
  "prefix": "glyphicon",
  "extraClasses": "fa-rotate-0",
}
            );


        var popup_153401d62a8e4bf73b4373eb0f4be4ea = L.popup({
  "maxWidth": "100%",
});


                var html_4c5a608d05628f8c847da5974c32c2fd = $(`<div id="html_4c5a608d05628f8c847da5974c32c2fd" style="width: 100.0%; height: 100.0%;">Decade: 2010</div>`)[0];
                popup_153401d62a8e4bf73b4373eb0f4be4ea.setContent(html_4c5a608d05628f8c847da5974c32c2fd);


        marker_677fa774ef1615524ddf73e474ba8476.bindPopup(popup_153401d62a8e4bf73b4373eb0f4be4ea)
        ;


                marker_677fa774ef1615524ddf73e474ba8476.setIcon(icon_31cbbfbfabbc71c67e77295c3aea3bc4);


            var poly_line_659560dd7b79374951bff3700427fed0 = L.polyline(
                [[37.89781572873332, -90.28823351822786], [37.603482366887334, -89.60580586924294]],
                {"bubblingMouseEvents": true, "color": "red", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "red", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            poly_line_659560dd7b79374951bff3700427fed0.bindTooltip(
                `<div>
                     2010 ➔ 2020
                 </div>`,
                {
  "sticky": true,
}
            );


            var marker_03c9f2ac224d64785aaf2ec45659f4d5 = L.marker(
                [37.603482366887334, -89.60580586924294],
                {
}
            ).addTo(map_8bd6259d59b32d933f413da6dc88ee0a);


            var icon_66e5580c6f16cccf04f483a10167efc0 = L.AwesomeMarkers.icon(
                {
  "markerColor": "blue",
  "iconColor": "white",
  "icon": "info-sign",
  "prefix": "glyphicon",
  "extraClasses": "fa-rotate-0",
}
            );


        var popup_ea87d5737a498dcf66aa016a975465a5 = L.popup({
  "maxWidth": "100%",
});


                var html_73a5adde16ad73f907960dac1cad2aec = $(`<div id="html_73a5adde16ad73f907960dac1cad2aec" style="width: 100.0%; height: 100.0%;">Decade: 2020</div>`)[0];
                popup_ea87d5737a498dcf66aa016a975465a5.setContent(html_73a5adde16ad73f907960dac1cad2aec);


        marker_03c9f2ac224d64785aaf2ec45659f4d5.bindPopup(popup_ea87d5737a498dcf66aa016a975465a5)
        ;


                marker_03c9f2ac224d64785aaf2ec45659f4d5.setIcon(icon_66e5580c6f16cccf04f483a10167efc0);

</script>
</html>