-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
220 lines (194 loc) · 11.1 KB
/
index.html
File metadata and controls
220 lines (194 loc) · 11.1 KB
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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<title>The Global Wage Gap</title>
<meta name="description" content="The Global Wage Gap">
<!-- C3 styles -->
<link href="css/styles.css" rel="stylesheet">
<link href="css/c3.min.css" rel="stylesheet">
<!--Ammap styles -->
<link rel="stylesheet" href="ammap/ammap.css" type="text/css" media="all" />
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="lat-wrap col-sm-12 container-fluid">
<div class="row lat-uw">
<div class="col-sm-4 nav-item">
<a href="#"><img id="burg" class="img-fluid" src="burg.png"></a>
</div>
<div class="col-sm-4 text-center nav-item">
<a href="http://www.latimes.com/"><img id="lat-logo" class="img-fluid" src="lat-logo.png"></a>
</div>
<!-- <div class="col-sm-4">
<button type="button" class="btn btn-sm"><p id="btn-text">12 WEEKS FREE</p><p id="btn-text">Start Trial</p></button>
</div> -->
</div>
</div>
<div class="col-sm-6 text header">
<div class="social-icons">
<span class="fb icon"><a href="#"><img src="fb.png"></a></span>
<span class="twit icon"><a href="#"><img src="twit.png"></a></span>
<span class="mail icon"><a href="#"><img src="mail.png"></a></span>
</div>
<h1>The global gender wage gap</h1>
<p> By <a href="http://conniehanzhangjin.com/">Connie Jin</a></p>
<h6>NOVEMBER 9, 2017</h6>
<p id="header-text" >Around the world, women still get paid lower wages than their male counterparts. In some places, this gap is wider than others. Take a look at the available data to see how your country measures up – in terms of the median male wage, how much less do women make in your country? </p>
</div>
<div class="row">
<div id="map" class="col-sm-8">
<div id="wagemapdiv" class="wage-chart" style="width: 800px; height: 500px;"></div>
</div>
</div>
<div class="col-sm-6 text">
<h3>Across nations</h3>
<p>Out of the most recent data, how do the surveyed countries compare to each other?</p>
<p>Korea has the widest gap (36.7%) between female and male salaries, with women making 63.3% of the male median wage. That means if a male worker got paid $66,000 (the average salary in Korea), a female worker might make only about $42,000.</p>
<p>Belgium has the smallest gap of 3.3%, with women making 96.7% of the male median wage.</p>
<p>The United States ranks somewhere in the middle, with a gap of 18.1% and women earning 81.9% of a man's wages.</p>
</div>
<div class="row">
<div id="map" class="col-sm-6">
<h4>Difference in country salaries, percentage of median male salary (2016 or latest available)</h4>
<div id="bar" class="bar-graph"></div> <!-- ok this should be in desc order but c3 refuses to work -->
</div>
</div>
<div class="col-sm-6 text">
<h3>Over time</h3>
<p>Looking at the countries surveyed, it seems that in most cases the pay gap between genders has decreased significantly since 2000, if not stayed steady.</p>
<p>In a couple of cases, however, the pay gap has only widened. Turkey, Portugal and Chile all reported increases in their wage gap.</p>
<p> See for yourself how the pay gap has changed across the years.</p>
</div>
<div class="row">
<div id="map" class="col-sm-6">
<h4>Change in country pay gap since 2000</h4>
<select id="drop-down">
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Belgium">Belgium</option>
<option value="Canada">Canada</option>
<option value="Chile">Chile</option>
<option value="CzechRepublic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Estonia">Estonia</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="Germany">Germany</option>
<option value="Greece">Greece</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="Ireland">Ireland</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Japan">Japan</option>
<option value="Korea">Korea</option>
<option value="Latvia">Latvia</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Mexico">Mexico</option>
<option value="Netherlands">Netherlands</option>
<option value="NewZealand">New Zealand</option>
<option value="Norway">Norway</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="SlovakRepublic">Slovak Republic</option>
<option value="Slovenia">Slovenia</option>
<option value="Spain">Spain</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Turkey">Turkey</option>
<option value="UnitedKingdom">United Kingdom</option>
<option value="UnitedStates">United States</option>
</select>
<div id="wageTimediv" class="wage-time"></div>
</div>
</div>
<div class="col-sm-6 text">
<h3>To consider</h3>
<p> What are the factors behind the wage gap in different countries? Of course, cultural differences contribute to a range of varying factors across the world. A 2013 Pew Research Center <a hhref="http://www.pewsocialtrends.org/2013/12/11/on-pay-gap-millennial-women-near-parity-for-now/">survey</a> found that women were more likely to say they had taken breaks from their careers to care for their families, and more women than men said they had taken time off or reduced their hours (~40%) to care for family members than men(~20%). These interruptions can have a <a href="http://amp.aom.org/content/21/1/7.abstract">significant impact</a> on long-term earnings. </p>
<p>Another factor could be the presence of fewer women in high-paying industries or jobs that are traditionally male-dominated, such as leadership or managerial positions. </p>
<p>Finally, the pay gap may also be due to gender discrimination in the workplace. In the same 2013 survey, women were twice as likely as men to say they had been discriminated against at work because of their gender. A Harvard Business Review <a href="https://l.facebook.com/l.php?u=https%3A%2F%2Fbuff.ly%2F2y7fWW6&h=ATNeAAr2eA5DRxzQ6CtI_MFIW8vHFWsUIzYUTzLWH45IEa7w9_WRQDzPSGXvbI2JsW9TFhSxtaaQIoOmslxgoV8SZMvTbIILYjA0fxIcHKpIZkeyOI0cb_laVyfTLDgS_AhK_JJvQdJnqjEi0FLvFm6dVpg2HIqP2gqApWcqbmWQgZVnA5rIXqXSx1lIxiNFOrfOt8HYyLTapjlrBcVQfLZnk3I5QT4qmRv4o6XSOUxTBL1gvp0pc7kEC3LJxxk2laz5mf2ZcKvHqQpM9X3ndK6YO6YKgjWdKZQHjR-gmx3FWUB7">study</a> published this year found that gender bias, moreso than differences in behavior, explains why women aren't advancing in the workplace.</p>
<p>On another note, when we talk about the wage gap, it's frequently about the topic of the binary gender wage gap between men and women. But it doesn't do to lose sight of other salary disparities for racial and sexual minorities.</p>
<p>For instance, November 2 was <a href="http://fortune.com/2017/11/02/eva-longoria-latina-equal-pay/?utm_content=buffer6d93c&utm_medium=social&utm_source=facebook.com&utm_campaign=buffer">Latina Equal Pay Day</a>, meaning that Latina women are only now breaking even with what white men made in 2016. The Williams Insitute finds that gay and bisexual men earn <a href="http://williamsinstitute.law.ucla.edu/wp-content/uploads/Badgett-Sears-Lau-Ho-Bias-in-the-Workplace-Jun-2007.pdf">10 to 30 percent less </a> than similarly qualified heterosexual men.</p>
</div>
<!-- <div class="col-sm-6 calc">
<h3>Looking forward</h3>
<form action="" id="form">
<div class="row calc-row">
<select class="col-sm-4 calc-item" id="Month" name="Month">
<option value="January">January</option>
<option value="February">February</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select class="col-sm-4 calc-item" id="Date" name="Date">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select class="col-sm-4 calc-item" id="Year" name="Year">
<option value="1980">1980</option>
<option value="1981">2</option>
</select>
</div>
</form>
</div> -->
<div class="col-sm-6 text">
<h3>Sources</h3>
<p>The data for this story came from the Organisation for Economic Co-operation and Development's <a href="http://www.oecd.org/gender/data/employment/">dataset</a> on gender equality in employment. Additional numbers were provided by the World Economic Forum's <a href="http://reports.weforum.org/global-gender-gap-report-2016/#read">Global Gender Report of 2016.</a></p>
</div>
<!-- aal JavaScript -->
<script src="ammap/ammap.js" type="text/javascript"></script>
<script src="ammap/maps/js/worldLow.js" type="text/javascript"></script>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<!-- D3, C3 stuff -->
<script src="js/d3.min.js"></script>
<script src="js/c3.min.js"></script>
<script src="js/line-graph.js"></script>
<!-- <script src="js/bar.js"></script> -->
<script src="js/scripts.js"></script>
</body>
</html>