-
Notifications
You must be signed in to change notification settings - Fork 2
/
story.html
547 lines (503 loc) · 31.3 KB
/
story.html
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
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<meta name='description' content='Story'>
<meta name='author' content='Spider Cartographers'>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
<script src="assets/scripts/jquery-3.5.0.min.js"></script>
<script src="assets/scripts/scrollstory/jquery.scrollstory.js"></script>
<script type="module" src="assets/scripts/generalScripts/burgermenu.js"></script>
<script src="assets/scripts/storyScripts/scrollstory.js"></script>
</head>
<body id="story">
<!-- burger menu -->
<div class="nav-toggle">
<div class="nav-toggle-bar"></div>
</div>
<nav class="nav">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="story.html">story</a></li>
<li><a href="map.html">map</a></li>
<li><a href="about.html">about</a></li>
</ul>
</nav>
<div id="container">
<!-- Opening Preabmle -->
<section class="story">
<div class="content">
<div class="Quote">
<h1 class="openTitle"> “We might not be able to fix the economy. But we can design the city to give people dignity, to make them feel rich.” </br>Enrique Peñalosa</h1>
</div>
<div id="little_city">
<img src="assets/images/blueCity.png" id="little_buildings" alt="City" style="width:100%; margin-top:5%">
<img src="assets/images/bikeIconFinal.png" id="little_bike" alt="Bike">
</div>
<div class="storyLinks">
<p class="openText">Transportation surrounds us in every facet of life (Delbosc, 2012). Pavements lead us to our supermarkets, bikes and buses connect us to our family and friends, and road and train networks take us across vast stretches of land to see
every corner of our nation. We have all become familiar with, and used to, the luxuries of modern transportation. As transportation evolves to the challenges of the 21st century, such as congestion and climate change, it is important to
consider our existing usage of transport modes and how we may shift towards more sustainable ones in the future (Buehler, 2012 and Laverty et al., 2013). </br> </br>Through analysing open data <a
href="https://opendata.arcgis.com/datasets/29fdaa2efced40378ce8173b411aeb0e_2.geojson" class="storyLinks" style="font-size:9px">1</a><a
href="https://www.ons.gov.uk/peoplepopulationandcommunity/populationandmigration/populationestimates/datasets/middlesuperoutputareamidyearpopulationestimates" style="font-size:9px" class="storyLinks">2</a><a
href="https://www.ons.gov.uk/employmentandlabourmarket/peopleinwork/earningsandworkinghours/datasets/smallareaincomeestimatesformiddlelayersuperoutputareasenglandandwales" style="font-size:9px" class="storyLinks">3</a><a
href="https://www.nomisweb.co.uk/census/2011/quick_statistics" style="font-size:9px">4</a><a href="https://www.nomisweb.co.uk/census/2011/bulk/rOD1" style="font-size:9px" class="storyLinks">5</a><a
href="https://data.gov.uk/dataset/ff93ffc1-6656-47d8-9155-85ea0b8f2251/national-public-transport-access-nodes-naptan" style="font-size:9px" class="storyLinks">6</a>, we identified areas of England and Wales that share similar
characteristics. Such
identification is an essential step towards successful policy interventions and financial investments aimed at increasing transport accessibility and sustainability (Collins and Chambers, 2005). Therefore, as a group of multidisciplinary urban analysts from various
corners of the world, we wish to share with you the story of our analysis.
</p>
</div>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<!-- Spatial Scale section -->
<section class="story">
<div class="content">
<img src="assets/images/MSOA_map.png" alt="MSOA map of the UK" class="MSOAMap">
<h2 class="spatialScaleHeader"> Spatial Scale</h2>
<p class="spatialScaleText">For this analysis, we used census data per middle layer super output area (MSOA). An MSOA is a geospatial statistic used in England and Wales that was created by the Office for National Statistics. It is used to
understand small areas of the country. The 2011 census reports 7,201 MSOAs with a mean population of 7,200 people and a minimum population of 5,000. While in some cases it may be helpful to aggregate MSOA data into larger geographical
areas, the below sections will demonstrate the issues of such aggregation for our analysis of transport characteristics. We start with aggregated, national level statistics and work our way down to the MSOA level to show that variations
exist at all spatial scales.</p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<!--Opening pie chart -->
<div id="chart">
<script src="https://d3js.org/d3.v3.min.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChart.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChartSetUp.js"></script>
</div>
<p style="color:#fff3e0;TEXT-ALIGN: CENTER;">WFH = Working from home</br> <i> Click on a legend label to see how total share would be redistributed without that mode.</i> </p>
<div class="totalMSOATravel">
<h2 class="avgTransportTimeTitle"> Total Travel Share for England And Wales </h2>
<p class="totalTravelMSOAText">Considering England and Wales as a whole, travel to work is primarily driven by car usage, followed by walking and taking the bus. Sustainable transport, which includes bus, train, metro, walking, and cycling,
only accounts for roughly 28% of total travel share. This suggests transportation in its current form is not prepared to help combat the climate crisis. However, given the disparities in transport access and socio-economic conditions
across England and Wales, total figures don’t show the full story. The most obvious discrepancy is between rural and urban areas.</p>
</br>
</div>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<!--Rural Vs Urban Pie Chart -->
<div class="openingRow" id="ruralVsUrban">
<div class="openingColumn">
<div id="chartUrban">
<h2 class="avgTransportTimeTitle"> Urban </br><i class="msoaCount">(5875 MSOAs)</i></h2>
<script src="https://d3js.org/d3.v3.min.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieUrbanChart.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChartUrbanSetUp.js"></script>
</div>
</div>
<div class="openingColumn">
<div id="chartRural">
<h2 class="avgTransportTimeTitle"> Rural </br><i class="msoaCount">(1326 MSOAs)</i></h2>
<script src="https://d3js.org/d3.v3.min.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieRuralChart.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChartRuralSetUp.js"></script>
</div>
</div>
</div>
<div class="urbanRuralDiv">
<h2 class="storyTitle"> Comparing Urban and Rural areas </h2>
<p class="ruralUrbanText">As seen in the pie charts above, both urban and rural populations are highly reliant on cars, although this is much more pronounced in rural areas. Taking the bus is more common in urban places, potentially due to
the larger number of bus stops per MSOA. The share of people working from home is much larger in rural communities, but in light of the COVID-19 pandemic we expect this will increase in urban constituencies. Walking continues to be an
important mode of transport for both geographies, perhaps demonstrating that people will choose to walk when they can.</br> </br>But such a crude categorization fails to show the variation amongst urban areas. For example, the next section
breaks down the transportation differences between London and Birmingham. </p>
</div>
</br>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<!--London Vs Birmingham Pie Chart -->
<div class="openingRow" id="londonVsBirmingham">
<div class="openingColumn">
<div id="chartLondon">
<h2 class="avgTransportTimeTitle"> London</br><i class="msoaCount">(978 MSOAs)</i></h2>
<script src="https://d3js.org/d3.v3.min.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieLondonChart.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChartLondonSetUp.js"></script>
</div>
</div>
<div class="openingColumn">
<div id="chartBirmingham">
<h2 class="avgTransportTimeTitle"> Birmingham</br><i class="msoaCount">(135 MSOAs)</i></h2>
<script src="https://d3js.org/d3.v3.min.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieBirminghamChart.js"> </script>
<script src="assets/scripts/storyScripts/pieCharts/pieChartBirminghamSetUp.js"></script>
</div>
</div>
</div>
<div>
<h2 class="storyTitle"> Comparing Urban Areas </h2>
<p class="londonVsBirminghamText">
Birmingham’s average car share is almost double London’s, but London has far more commuting by the Underground and train due to mass investment in infrastructure. This is highlighted by the fact that London has its vast Underground
network,
whereas Birmingham has only a single metro line. Thus, there are differences in accessibility to various transport modes between these two cities. This is indicative of variation that may exist amongst all cities in England and Wales.
</br> </br>
However, even this level of disaggregation is insufficient as it ignores the variation that exists within cities. In other words, an MSOA in Birmingham may be more similar to an MSOA elsewhere than to another MSOA in Birmingham.
</p>
</div>
</br>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<div class="openingRow">
<div class="openingColumn">
<img src="assets/images/london.gif" alt="Gif of transport variation in London" class="cityGif">
</div>
<div class="openingColumn">
<h2 class="avgTransportTimeTitle"> Analysing Variation Within Cities </h2>
<p class="cityText">As an example, London may be better served in terms of public transport than any other area in England and Wales, but services in London are by no means uniformly distributed. The animation to the left shows notable
nonconformity across London for several variables, such as bus stop density and car ownership, which are used to understand transport profiles. Is it possible that some areas of London have worse service than other urban areas in
England and Wales? The answer to that question, and many others, lies in looking at the data at the MSOA level.</p>
</br>
</br>
<p class="cityText"> You can view these maps as photos, by clicking on the links → <a href="assets/images/busModeShare.png" target="_blank" alt="bus share map"> Bus mode share </a> ,<a href="assets/images/carOwnership.png" target="_blank"
alt="car ownership map"> Car Ownership </a> ,<a href="assets/images/busStopDensity.png" target="_blank" alt="bus stop density map"> Bus stop density </a> ,<a href="assets/images/metroModeShare.png" target="_blank"
alt="metro mode share map"> Metro mode share </a> &<a href="assets/images/tube_map.png" target="_blank" alt="tube density map"> Tube density </a>
</div>
</div>
<p class="nextButton" style="margin-top: 20%;"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<h2 class="storyTitle"> MSOA Level Statistics</h2>
<p class="transportTextAcess"> Having established the need to conduct our analysis at the MSOA level, the following sections of our story examine public transport characteristics at this scale. </p>
<div class="container">
<canvas id="barChart" class="chartjs-render-monitor"></canvas>
</div>
<script src="assets/scripts/chart.js/dist/Chart.js"></script>
<script src="assets/scripts/storyScripts/transportBarBox.js"></script>
</br> </br>
<h2 class="storyTitle"> Public Transport Access</h2>
<p class="transportTextAcess">Looking at public transport accessibility, bus stops are by far the most prevalent type of transport facility. There are over 270,000 bus stops across England and Wales, with only two MSOAs having no bus stops at
all. </br> </br>That being said, other public transportation modes are less commonplace. Only a fourth of MSOAs have train stations at all, showcasing an uneven distribution in public transportation infrastructure. This is even more
apparent when looking at metro, tram and underground stations as there are only 899 these. Only eight percent of MSOAs have one.</p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<div id="my_dataviz1"></div>
<script src="https://d3js.org/d3.v4.js"></script>
<script src="assets/scripts/storyScripts/boxPlot.js"> </script>
<h2 class="storyTitle"> Variations in Travel by Car</h2>
<p class="boxPlotText"> Different MSOAs rely on cars to varying degrees. Unsurprisingly, a decreased dependency on cars is commonly mirrored by a highly accessible public transport network. On the other hand, MSOAs lacking a public transport
network tend to be very reliant on private vehicle travel. </p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<div class="container">
<canvas id="barChartPeople" class="chartjs-render-monitor"></canvas>
</div>
<script src="assets/scripts/chart.js/dist/Chart.js"></script>
<script src="assets/scripts/storyScripts/peopleAndPublicTransport.js"></script>
<h2 class="storyTitle"> Sustainable Travel </h2>
<p class="peopleAndPublicTransportText"> Some of the transport methods can be combined into the following categories: active transport (walking and cycling) and public transport (bus, train, and metro). Together, these constitute sustainable
transport. We can see that while some MSOAs have low shares of sustainable transport, others have extremely high levels of public transport usage or active travel. It is useful to compare the high usage cases to the average use of each of
these modes across England and Wales and to highlight that higher levels of sustainable transport usage are possible in some places. </p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<!--Travel times -->
<div class="row">
<h2 class="avgTransportTimeTitle"> Average Travel Time Per Transport Mode </h2>
<div class="column">
<img src="assets/images/trainIcon.png" class="trainImage" alt="Train">
<h4 class="travelTime" class="transportTimeTitle"> 67 Minutes </h4>
</div>
<div class="column">
<img src="assets/images/busIconFinal.png" class="otherImage" alt="Bus">
<h4 class="travelTime" class="transportTimeTitle"> 28 Minutes </h4>
</div>
<div class="column">
<img src="assets/images/carIconFinal.png" alt="Car" class="otherImage">
<h4 class="travelTime" class="transportTimeTitle"> 12 Minutes </h4>
</div>
</div>
<p class="travelTimeText">Given the wide range of transport accessibility and mode choice, it is worth acknowledging that those who choose different commute modes spend different amounts of time on their commute. </p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<h2 class="storyTitle">Identifying Transport Profiles </h2>
<p class="travelTimeText">It is evident that there is considerable variation and heterogeneity in transport characteristics of MSOAs across England and Wales. The next step was to determine whether different groups of MSOAs with a similar
transport profile could be identified. To do so, we used the transport characteristics discussed above, such as commuting mode shares, car ownership and travel time accessibility by different modes to represent the transport profile of an
MSOA. </br> </br>We used a clustering algorithm to group the MSOAs into distinct transport profiles (Shelton et al., 2006). Clustering algorithms group data points to maximize similarity within groups and minimize it between them. Our clustering revealed five
distinct groups in our data: </p>
<div class="barCharDiv" id="clusterPie0">
<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/d3-scale-radial.js"></script>
<script src="assets/scripts/storyScripts/cluster0Treemap.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<p class="clusterDescription"><b>Good train accessibility but car dependant </b> </br> </br> This cluster is composed of rural areas that surround land-locked urban areas. The MSOAs in this
cluster
are mainly in the center of England and Wales, compared to the rural areas in profile 2, which are on the outskirts.
This cluster has the second best accessibility scores for all measured transport modes due to the central locations. The cluster benefits from being on train routes and has the second highest train usage, but that is the only mode of
public transport that the MSOAs in this cluster are serviced by. As a result, the cluster is associated with high car ownership and usage, followed by train and walking.</p>
</div>
<div class="barCharDiv" id="clusterPie1">
<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/d3-scale-radial.js"></script>
<script src="assets/scripts/storyScripts/cluster1Treemap.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<p class="clusterDescription"><b>Solely car dependant </b> </br> </br> This cluster is made up of rural areas far from the cities. The MSOAs have few public transport options and people depend on
cars to move around. They have poor accessibility even by car, and this could be due to a lack of direct road and other connections between them and other parts of the country. The cluster is found on the periphery of profile 3, which is
itself made up of coastal urban areas with poor accessibility.</p>
</div>
<div class="barCharDiv" id="clusterPie2">
<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/d3-scale-radial.js"></script>
<script src="assets/scripts/storyScripts/cluster2Treemap.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<p class="clusterDescription"><b>Lack of accessibility across all transport modes </b> </br> </br> This cluster shows the third highest usage of bus, bicycle and walking to work, but has the
lowest
train usage, working from home (WFH) and all around accessibility. The most popular modes to travel to work are by car, by walking and bus, but the lack of accessibility across all modes and little train usage is the defining feature.
This can
be found in coastal towns and cities such as Newcastle, Cardiff and Blackpool, which might suggest the MSOAs are at the end of train lines and other transport networks and therefore lack external connectivity.</p>
</div>
<div class="barCharDiv" id="clusterPie3">
<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/d3-scale-radial.js"></script>
<script src="assets/scripts/storyScripts/cluster3Treemap.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<p class="clusterDescription"><b>High public transport and good accessibility </b> </br> </br> The cluster is associated with high usage of public transport including the underground/metro/tram,
train and bus. It is noted to have very good accessibility to all MSOAs through all transport modes. This cluster dominates London, but can also be found in the centre of some MSOAs in big cities like Manchester and Birmingham. The
cluster suggests that the transport profile of London is different to the rest of the UK and can only otherwise be found in high accessibility centres of large cities.</p>
</div>
<div class="barCharDiv" id="clusterPie4">
<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/d3-scale-radial.js"></script>
<script src="assets/scripts/storyScripts/cluster4Treemap.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<p class="clusterDescription"><b>Car reliant but high public transport </b> </br> </br> This cluster has high car usage but is notable for the comparitvely large number of people who use the bus
and walk to work. These MSOAs also have a high degree of accessibility but the overall transport profile is more shifted towards cars than the previous cluster. This is found in large Urban areas across the UK such as Manchester and
Birmingham, suggesting that the main difference between these and London is the degree of usage of public transport with the main difference occurring due to the lack of usage of an underground/metro/tram.</p>
<p class="nextButton" style="margin-left: -75%; margin-top: 5%;"><a href="#" class="next">Next →</a></p>
</div>
</div>
</section>
<section class="story">
<div class="content">
<div class="barCharDiv" id="barCar"></div>
<script src="assets/scripts/storyScripts/clusterCarAvgTime.js"></script>
<script src="assets/scripts/storyScripts/clusterBusAvgTime.js"></script>
<script src="assets/scripts/storyScripts/clusterTrainAvgTime.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
<h2 class="storyTitle"> Accessibility by Transport Mode in the Profiles</h2>
<p class="peopleAndPublicTransportText"> As explained above, the clusters differ in their accessibility. To get a feeling of this variation, the bar charts above compare the average accessibility by transport mode across the different
clusters.</p>
<p class="nextButton"><a href="#" class="next">Next →</a></p>
</div>
</section>
<section class="story">
<div class="content">
<h2 class="storyTitle"> Relationship between Transport Profiles and Demographics </h2>
<div class="storyLinks">
<p class="peopleAndPublicTransportText"> As an additional step we began to explore how, if at all, transport profiles relate to demographic characteristics (Harris et al., 2007). We attempt to answer this through a classification analysis, which is explained in
detail in our<a href="./Report/Group0_SDCFinalReport.pdf" target="_blank"> methodology </a> (Titheridge et al., 2008). The classification analysis was performed using a Random Forest Classification algorithm, including factors which have been found to be related to transport usage
like population density, net annual income, and mean age. 65% of MSOAs were able to be correctly classified by the demographic factors, with population density and net annual income being the most important factors relating to the
identification of the transport profile.</p>
</br>
<img src="assets/images/tree_transparent.png" alt='classification tree' style="width: 80%;margin-left: 10%;">
<p class="peopleAndPublicTransportText"> An example of one of the decision trees from the algorithm can be seen above. It shows us how the algorithm worked to predict which transport profile an MSOA belonged to. For example, transport
profile
4 (high public transport and good accessibility) is associated with an income above £33,850 with the percentage of households owned being greater than 59.25%. In contrast, transport profile 1 (good train accessibility but car dependent)
is
associated with an income below £33,850 and a mean age of less than 38.25 years. The issue, however, is that this is one of many decision trees created by the algorithm. To get a better understanding of the result of the classification,
it
would be necessary to examine more trees. This would help inform us as to which demographic factors are related to the cluster outputs. </p>
<p class="nextButton"><a href="map.html">View our interactive map →</a></p>
</div>
</div>
</section>
</div>
<h2 class="storyTitle"> Further Reading </h2>
<ul class="storyLinks" style="margin-left:10%;margin-right:10%;">
<a href="./Report/Group0_SDCFinalReport.pdf" target="_blank">
<li> Our methodology </li>
</a>
<a href="https://github.com/natesheehan/spidercartographers">
<li> Our github </li>
</a>
<a href="http://dev.spatialdatacapture.org:8717/">
<li> Our API documentation </li>
</a>
<a href="https://towardsdatascience.com/unsupervised-learning-and-data-clustering-eeecb78b422a">
<li class="storyLinks"> Clustering </li>
</a>
<a href="https://medium.com/@categitau/in-one-of-my-previous-posts-i-introduced-machine-learning-and-talked-about-the-two-most-common-c1ac6e18df16">
<li> Classification </li>
</a>
<a href="https://www.sciencedirect.com/science/article/pii/S0966692310001171">
<li>Buehler, R., 2011. Determinants of Transport Mode Choice: A Comparison of Germany and the USA. Journal of Transport Geography, 19, pp. 644-657.</li>
</a>
<a href="https://journals.sagepub.com/doi/10.1177/0013916504265440">
<li>Collins, C., and Chambers, S., 2005. Psychological and Situational Influences on Commuter-Transport-Mode Choice. Environment and Behaviour, 37, pp. 640-661.</li>
</a>
<a href="https://www.researchgate.net/publication/233390464_The_role_of_well-being_in_transport_policy">
<li>Delbosc, A., 2012. The Role of Well-Being in Transport Policy. Transport Policy, 23, pp. 25-33.</li>
</a>
<a href="https://link.springer.com/article/10.1007/s11113-007-9042-9">
<li>Harris, R., Johnston, R., and Burgess, S., 2007. Neighborhoods, Ethnicity and School Choice: Developing a Statistical Framework for Geodemographic Analysis. Population Research Policy Review, 26, pp. 553-579.</li>
</a>
<a href="https://www.sciencedirect.com/science/article/pii/S0749379713003334">
<li>Laverty, A., Mindell, J., Webb, E., and Millett, C., 2013. Active Travel to Work and Cardiovascular Risk Factors in the United Kingdom. American Journal of Preventive Medicine, 45(3), pp. 282-288.</li>
</a>
<a href="https://pubmed.ncbi.nlm.nih.gov/16221559/">
<li>Shelton, N., Birkin, M., and Dorling, D., 2006. Where Not to Live: A Geo-Demographic Classification of Mortality for England and Wales, 1981-2000. Health & Place, 12, pp. 557-569.</li>
</a>
<a href="https://repository.lboro.ac.uk/articles/Using_geo-demographic_analysis_to_calculate_patronage_figures_for_rural_buses_Final_report/9460964">
<li>Titheridge, H., Potter, S., Enoch, M., and Bannister, D., 2008. Using Geo-Demographic Analysis to Calculate Patronage Figures for Rural Buses. Final report, London: UCL and the Open University.</li>
</a>
</ul>
<script type="module" src="assets/scripts/storyScripts/littleCityAnimation.js"></script>
</body>
<p><a href="#" class="backtotop">Back to top ↑</a></p>
<style>
@import url("https://fonts.googleapis.com/css?family=Glegoo|Roboto:300,400");
$breakpoint-small: 480px;
$breakpoint-regular: 768px;
$breakpoint-medium: 1024px;
@mixin small-screen {
@media screen and (max-width: #{$breakpoint-small - 1px}) {
@content;
}
}
@mixin regular-screen {
@media screen and (min-width: #{$breakpoint-small}) and (max-width: #{$breakpoint-regular - 1px}) {
@content;
}
}
@mixin medium-screen {
@media screen and (min-width: #{$breakpoint-regular}) and (max-width: #{$breakpoint-medium - 1px}) {
@content;
}
}
@mixin large-screen {
@media screen and (min-width: #{$breakpoint-medium}) {
@content;
}
}
* {}
html,
body {
min-height: 100%;
min-height: 100vh;
background-color: #1b262c;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
section {
display: flex;
align-items: center;
justify-content: center;
min-height: 100%;
min-height: 100vh;
opacity: 0.4;
flex: 0 0 auto;
}
.scrollStoryItem {
filter: blur(20px);
transition: all 400ms ease;
.content {
transform: scale(1.1);
transition: all 400ms ease;
}
}
.content {
@include small-screen {
width: 90%;
}
@include regular-screen {
width: 90%;
}
@include medium-screen {
width: 70%;
}
@include large-screen {
width: 60%;
}
}
.openingColumn {
float: left;
width: 50%;
padding: 10px;
height: 300px;
color: #fff3e0;
}
/* Clear floats after the columns */
.openingRow:after {
content: "";
display: table;
clear: both;
}
.active {
opacity: 1;
filter: none;
.content {
transform: scale(1);
}
.attribution {
font-family: futura;
font-weight: 400;
color: #fff3e0;
margin-top: 1.2rem;
}
p,
a {
font-family: futura;
font-weight: 300;
color: #fff3e0;
;
margin-top: 2rem;
line-height: 1.3;
text-decoration: none;
a {
color: #1b262c;
&:hover,
:active {
padding-bottom: 0.2rem;
border-bottom: 1px solid;
transition: all 400ms ease;
}
}
}
</style>
<script>
$(function() {
$("#container").scrollStory();
});
$('#container').scrollStory({
triggerOffset: 250
});
$(".next").click(function(event) {
event.preventDefault();
$("html,body").animate({
scrollTop: $(this)
.parents()
.next()
.offset().top
},
"slow"
);
});
$(".backtotop").click(function() {
$("html,body").animate({
scrollTop: $("html,body").offset().top
}, "slow");
});
</script>
</html>