forked from stephentcosta/IDVStudio2
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·195 lines (163 loc) · 8.54 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Basic Page Needs
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>Rent Poverty in East Boston</title>
<meta name="description" content="">
<meta name="author" content="">
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- FONT
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/EastBoston_styles.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/favicon.png">
</head>
<body>
<!-- Custom Fonts -->
<style>
@font-face {
font-family: "GrifoL-Bold";
src: url(https://web.northeastern.edu/visualizingeastie/fonts/Grifo-L-Bold.otf);
}
body {font-family: "GrifoL-Bold","Georgia",serif}
@font-face {
font-family: "BentonSansCond-Bold";
src: url(https://web.northeastern.edu/visualizingeastie/fonts/BentonSansCond-Bold.otf);
}
body {font-family: "BentonSansCond-Bold","Helvetica",sans-serif}
</style>
<!-- Hamburger menu
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<nav role="navigation" class="EastBoston_nav" >
<div id="menuToggle">
<!--
A fake / hidden checkbox is used as click reciever,
so you can use the :checked selector on it.
-->
<input type="checkbox" />
<!--
Some spans to act as a hamburger.
-->
<span></span>
<span></span>
<span></span>
<ul id="menu" >
<a href="https://web.northeastern.edu/visualizingeastie" ><li style="font-size: 3rem; line-height: 3rem">All stories</li></a>
<a href="https://web.northeastern.edu/visualizingeastie/the-people" ><li style="font-size: 3rem; line-height: 3rem">The people</li></a>
<a href="https://web.northeastern.edu/visualizingeastie/the-environment "><li style="font-size: 3rem; line-height: 3rem">The environment</li></a>
<a href="https://web.northeastern.edu/visualizingeastie/the-built-city"><li style="font-size: 3rem; line-height: 3rem">The built city</li></a>
<a href="https://web.northeastern.edu/visualizingeastie/the-institutions"><li style="font-size: 3rem; line-height: 3rem">The institutions</li></a>
</ul>
</div>
</nav>
<!-- Primary Page Layout
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<div class="container">
<div class="row">
<div class="column EastBoston">
<h1 class="EastBoston_head">Rising East Boston rents...</h1>
<h2 class="EastBoston_head">Could the worst be yet to come?</h2>
<p>Amazon recently included Boston on its list of 20 cities being condidered for the site of its second headquarters. The city's proposal names Suffolk Downs in East Boston as the site. Already in the news for increased gentrification and corresponding rent increases, East Boston rents would likely see a significant increase if Amazon came and added its estimated 50,000 jobs.
</p>
<h5 class="EastBoston_byline">By DAN SPECTOR, STEPHEN COSTA, AND JOHN lilly </h5>
<hr>
<h2 class="EastBoston_head">Rent Increases in East Boston</h2>
<p>We looked at rent increases in Amazon’s headquarter city of Seattle to predict the effects of a headquarters in East Boston.</p>
</div>
<div id="chart">
</div>
<p>South Lake Union, the neighborhood home of Amazon Headquarters in Seattle, has about half the population of East Boston. But South Lake Union has relatively fewer people per household: its roughly 20,000 residents live in 11,625 households, while East Boston's 40,000 residents are clustered in 15,453 households. If the household size decreases, it could drive rent prices, especially for one-bedroom apartments, even higher.</p>
<hr>
<div id="chart2">
</div>
<p>Three-bedroom apartments could also become significantly more expensive, which would disproportionately affect families. If rents rise in East Boston, it is likely to lead to significant displacement of current residents. It is unclear where these residents would go. <a href="https://www.bostonglobe.com/metro/2017/09/23/seattlegrowth/WgwzzDLEiR2DM9bLYWwIUP/story.html">According to The Boston Globe,</a> the Seattle non-profit, Mary's Place went from filling 2,300 beds in overnight shelters in 2010 to being on pace to fill over 170,000 in 2017.</p>
<hr>
<table class="tg">
<!-- HEADER ONE -->
<tr>
<th class="leftcol"><font class="EB1small">Eastie 2017</font></th>
<th class="centcol"></th>
<th class="trighcol"><font class="B1small">Eastie 2023</font></th>
</tr>
<tr>
<!-- ROW ONE -->
<th class="leftcol">
<font class="EB1big">12/mi<sup>2</sup></font><br>
<font class="EB1small">current population density</font>
</th>
<th class="centcol">
<img class="mobiHide" width="50%" src="ICON.png">
</th>
<th class="rightcol">
<font class="B1big">12/mi<sup>2</sup></font><br>
<font class="B1small">projected population density</font>
</th>
<!-- HEADER TWO -->
<tr>
<th class="leftcol"><font class="EB1small"></font></th>
<th class="centcol">Population</th>
<th class="trighcol"><font class="B1small"></font></th>
</tr>
<!-- ROW TWO -->
<tr>
<th class="leftcol">
<font class="EB1big">12,345<sup>2</sup></font><br>
<font class="EB1small">current population</font>
</th>
<th class="centcol">
<img class="mobiHide" width="50%" src="ICON.png">
</th>
<th class="rightcol">
<font class="B1big">12,345<sup>2</sup></font><br>
<font class="B1small">population if all employees moved to Eastie</font>
</th>
<!-- HEADER THREE -->
<tr>
<th class="leftcol"><font class="EB1small"></font></th>
<th class="centcol"></th>
<th class="trighcol"><font class="B1small"></font></th>
</tr>
<!-- ROW THREE -->
<tr>
<th class="leftcol">
<font class="EB1big">12,345</font><br>
<font class="EB1small">current population</font>
</th>
<th class="centcol">
<img class="mobiHide" width="50%" src="ICON.png">
</th>
<th class="rightcol">
<font class="B1big">12,345</font><br>
<font class="B1small">population if all employees moved to Eastie</font>
</th>
</tr>
<!-- ROW ONE -->
</table>
<hr>
<h2 class="EastBoston_head">In conclusion.</h2>
<p>Given the difference in makeup between the cities care should be taken in making direct correlations between South Lake Union and East Boston. For example, there are 127 neighborhoods in Seattle and only 23 in Boston. Seattle is considered to have made a slow response to a brisk increase in demand to an already tight inventory. East Boston and surrounding communities will need to work vigorously in the five-year build up if Boston rents are to avoid similar increases should Amazon bring its HQ 2.0 to Beantown.</p>
<hr>
</div>
</div>
<h6 class="EastBoston_footer"><span class="EastBoston_footer">Visualizing Eastie</span> is a project of the <a href="https://www.northeastern.edu/visualization/">Information Design and Visualization program</a> at Northeastern University. © 2018</h6>
<!-- End Document
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script src="./queue.min.js"></script>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://unpkg.com/d3-simple-slider@0.2.0/build/d3-simple-slider.js"></script>
<script src="js/neighborhoods.js"></script>
<script src="js/main.js"></script>
<script src="js/main2.js"></script>
<script src="js/ebmap.js"></script>
</body>
</html>