-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
271 lines (229 loc) · 12.4 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
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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<title>Beyond Education Outcomes</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=3.0, minimum-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<!-- <link rel="stylesheet" type="text/css" href="css/responsive.css"> -->
<!-- <link rel="stylesheet" type="text/css" href="css/urban-header.css"> -->
<link rel="stylesheet" type="text/css" href="css/vendor/jquery-ui.css">
<!-- <link rel="stylesheet" type="text/css" href="css/styles.css"> -->
<link rel="stylesheet" type="text/css" href="css/charts.css">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@urbaninstitute">
<meta name="twitter:creator" content="@urbaninstitute">
<meta name="twitter:title" content="Beyond Education Outcomes">
<meta name="twitter:description" content="Where are students given the tools to succeed in school?">
<meta name="twitter:image" content="https://apps.urban.org/features/education-equity-tool/img/social-twitter.png">
<meta property="og:title" content="Beyond Education Outcomes" />
<meta property="og:description" content="Where are students given the tools to succeed in school?" />
<meta property="og:image" content="https://apps.urban.org/features/education-equity-tool/img/social-og.png" />
<meta property="og:image:type" content="image/png">
<meta property="og:url" content="https://urbn.is/3K28phH">
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"headline": "Beyond Education Outcomes",
"url": "https://apps.urban.org/features/education-equity-tool",
"thumbnailUrl": "https://apps.urban.org/features/education-equity-tool/img/social-og.png",
"dateCreated": "2022-01-24T05:00:00.000Z",
"articleSection": "Interactive Feature",
"creator": [
"Leonardo Restrepo ",
"Erica Blom",
"Allison Feldman",
"Fernando Becerra ",
"Luis Melgar",
"David Hinson",
"Wesley Jenkins"
],
"keywords": ["Education and Training"]
}
</script>
</head>
<body>
<!-- START HEADER -->
<div id="header-pinned" class="no-touch">
<a target="_blank" href="https://www.urban.org" title="Home" rel="home" class="site-logo"></a>
<div class="title">
<span class="feature-link">
<a href="https://www.urban.org/features" class="title-linkback" alt="Urban Institute logo">Features : : Beyond Education Outcomes</a>
</span>
<div id='go-back-big' style="display: none">
<div id='go-back-text-big'>
Take me back to state view
</div>
</div>
</div>
</div>
<div class="headerimage" id="heroimage">
<div class="wrapper headerwrapper">
</div>
</div>
<div id="intro">
<div id="introText">
<h1>Beyond Education Outcomes</h1>
<h2>Where are students given the tools to succeed in school?</h2>
<p id="date">January 27, 2022</p>
<hr>
<div id='share-icons'>
<a href="https://twitter.com/intent/tweet?text=Beyond%20education%20outcomes%3A%20Where%20are%20students%20given%20the%20tools%20to%20succeed%20in%20school%3F%20(via%20%40urbaninstitute)%20https%3A%2F%2Furbn.is%2F3K28phH" target="_blank"><img class='share-icon' src="img/icon-twitter.svg" /></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//urbn.is/3K28phH" target="_blank"><img class='share-icon' src="img/icon-facebook.svg" /></a>
<a href="https://reddit.com/submit?url=https://urbn.is/3K28phH&title=Beyond%20education%20outcomes%3A%20Where%20are%20students%20given%20the%20tools%20to%20succeed%20in%20school%3F" target="_blank"><img class='share-icon' src="img/icon-reddit.svg" /></a>
<a href="mailto:%20?Subject=New%20Urban%20Institute%20interactive&Body=Hi!%20I%20thought%20you%27d%20be%20interested%20in%20this%20new%20interactive%20from%20the%20Urban%20Institute:%20%22Beyond%20Education%20Outcomes%22%20https://urbn.is/3K28phH" target="_blank"><img class='share-icon' src="img/icon-email.svg" /></a>
</div>
</div>
</div>
<!-- END HEADER -->
<div id="containerFeature">
<p class="general">Student success is typically measured through outcomes, such as test scores and graduation rates. But those measures often overlook the inputs—including access to experienced teachers, counselors, and other resources—that helped create those outcomes.</p>
<p class="general">The <a href="https://www.urban.org/research/publication/when-school-segregated-making-sense-segregation-65-years-after-brown-v-board-education" target="_blank">legacy of explicit school segregation and present-day discriminatory practices</a> mean many students of color are left without equitable access to the resources needed for a robust education. By understanding the extent of these inequities in students’ learning environments, policymakers can address these disparities and expand students’ educational opportunities. </p>
<p class="general">This tool displays the share of students from different racial and ethnic backgrounds who attend schools that have access to some of the resources <a href="https://www.urban.org/policy-centers/center-education-data-and-policy/projects/broader-measure-student-achievement-and-learning-traditional-public-high-schools" target="_blank">evidence shows are beneficial for learning</a>: experienced teachers, Advanced Placement (AP) classes, and school counselors. Below, select two racial or ethnic groups to compare access to opportunity for different groups of students and how it varies by state and by school district.</p>
</div>
<div id="container">
<div>
<div id="metrics">
</div>
<div id='metrics-text'>
</div>
</div>
<div id="forms">
<span>
Show gap between
</span>
<div class="dropdown" id="dropdown1">
<div class="dropbtn" id="dropbtn1"></div>
<div id="raceEth1" class="dropdown-content"></div>
</div>
<span class='between-dropdowns'>and</span>
<div class="dropdown" id="dropdown2">
<div class="dropbtn" id="dropbtn2"></div>
<div id="raceEth2" class="dropdown-content"></div>
</div>
<span id="state-div" style="display: none">
for districts in
</span>
<div class="dropdown" id="dropdown3" style="display: none">
<div class="dropbtn" id="dropbtn3"></div>
<div id="state-menu" class="dropdown-content"></div>
</div>
<span id="state-back" style="display: none">
Take me back to the state view.
</span>
</div>
<div id="explanation-text" style="display: inline-block">
</div>
<div id="districts-views">
</div>
<div style="display: inline-block; width: 100%">
<div id="chart-title"></div>
<div id="toggle">
<div id='toggle-scale'>
EXPAND SCALE
<label class="switch">
<input type="checkbox" checked>
<span class="slider round"></span>
</label>
</div>
<div id='toggle-gap'>
SORT BY GAP
<label class="switch">
<input type="checkbox">
<span class="slider round"></span>
</label>
</div>
</div>
</div>
<div id="chart"></div>
<div id='no-data-note' style="display: none">
* In states or districts where fewer than 50 students belong to a certain racial or ethnic group, the group is not displayed.
</div>
<div class="row" id="search" style="display: none">
<span>
<div contenteditable="true" id="search-box">Start typing...</div>
<span id='number-selected'></span>
</span>
<div id="search-list" class="dropdown-content"></div>
</div>
<div class="row" id="selected-districts" style="display: none">
</div>
</div>
<div id='sticky'>
<span>Show gap in</span>
<div class="dropdown" id="dropdown4">
<div class="dropbtn" id="dropbtn4"></div>
<div id="metric-sticky" class="dropdown-content"></div>
</div>
<span>between</span>
<div class="dropdown" id="dropdown5">
<div class="dropbtn" id="dropbtn5"></div>
<div id="raceEth1-sticky" class="dropdown-content"></div>
</div>
<span>and</span>
<div class="dropdown" id="dropdown6">
<div class="dropbtn" id="dropbtn6"></div>
<div id="raceEth2-sticky" class="dropdown-content"></div>
</div>
</div>
<div id='see-data' style="display: none">
<div id='see-data-text'>
Want to see data for districts in this state?
</div>
<div id='see-data-button'>
See data
</div>
</div>
<div id='go-back' style="display: none">
<div id='go-back-arrow'>
<img src="img/icon-right-arrow.svg" />
</div>
<div id='go-back-text'>
Back to state view
</div>
</div>
<footer>
<div class="content">
<h4>About the Data</h4>
<p>All district-level results exclude charter schools. For district-level results on courses and counselors, we only include school districts with at least two non-charter high schools. For district-level results on teachers, we only include districts with at least two non-charter elementary schools.</p>
<p>The data are from the Common Core of Data and the Civil Rights Data Collection for the 2017–18 school year, accessed through the <a href="https://educationdata.urban.org/data-explorer/" target="_blank">Urban Institute’s Education Data Portal</a>.</p>
<h4>Project credits</h4>
<div class="urbanstatement">
<p>This feature was funded by the Bill & Melinda Gates Foundation. We are grateful to them and to all our funders, who make it possible for Urban to advance its mission. The views expressed are those of the authors and should not be attributed to the Urban Institute, its trustees, or its funders. Funders do not determine research findings or the insights and recommendations of Urban experts. More information on our funding principles is available <a href="https://www.urban.org/aboutus/funding-principles">here</a>. Read our terms of service <a href="https://www.urban.org/terms-service">here</a>.</p>
<p>We are also grateful to Ivy Morgan and the Education Trust for their guidance and thought partnership in helping to make this work relevant to and actionable for those advocating for a more equitable distribution of resources across schools.</p>
</div>
<div class="credits-item">
<h3 class="job">Research</h3>
<p class="creditsWho"><a href="https://www.urban.org/author/leonardo-restrepo" target="_blank">Leonardo Restrepo</a> and <a href="https://www.urban.org/author/erica-blom" target="_blank">Erica Blom</a></p>
</div>
<div class="credits-item">
<h3 class="job">Design</h3>
<p class="creditsWho">Allison Feldman</p>
</div>
<div class="credits-item">
<h3 class="job">Development</h3>
<p class="creditsWho">Fernando Becerra (<a href="https://www.fernandobecerra.com" target="_blank">fernandobecerra.com</a>) and Luis Melgar</p>
</div>
<div class="credits-item">
<h3 class="job">Editing</h3>
<p class="creditsWho">David Hinson and Zach VeShancey</p>
</div>
<div class="credits-item">
<h3 class="job">Writing</h3>
<p class="creditsWho">Wesley Jenkins</p>
</div>
<div class="footerLinks">
<p class="footerLink">View this project on <a href="https://github.com/UrbanInstitute/education-equity-tool" target="_blank">GitHub</a>.</p>
</div>
</div>
</footer>
<script src="js/vendor/jquery-1.12.4.js"></script>
<script src="js/vendor/jquery-ui.js"></script>
<script src="js/vendor/d3v7.1.1.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>