-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
95 lines (93 loc) · 4.97 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
<html>
<head>
<title>European Refugee Crisis</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/dc.css"/>
<link rel="stylesheet" type="text/css" href="css/leaflet.css"/>
<link rel="stylesheet" type="text/css" href="css/site.css"/>
<link rel="stylesheet" type="text/css" href="css/introjs.css"/>
<script src="js/jquery.js"></script>
<script src="js/d3.min.js"></script>
<script src="js/crossfilter.v1.min.js"></script>
<script src="js/dc.js"></script>
<script src="js/leaflet.js"></script>
<script src="js/dc.leaflet.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/d3.tip.min.js"></script>
<script src="js/intro.js"></script>
<script src="data/routes_geom.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-46399763-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div class="container">
<div class="row">
<h1>European Refugee Crisis Migration Routes</h1>
<div class="col-xs-8">
<p>A dashboard to explore data regarding the European Refugee Crisis and the migration routes used. The graphs and maps can be clicked and interacted with to filter the data. Click the Animate button to watch the migration routes change over time. For extra help click the help button to the right. The data was kindly provided by <a href="http://frontex.europa.eu/" target="_blank">Frontex</a>. For more information contact: <a href="https://twitter.com/Simon_B_Johnson">@simon_b_johnson</a>. This visualisation has been designed for desktop and may not work on mobile.</p>
</div>
<div class="col-xs-2">
<button id="intro" class="btn btn-default">Help</button>
</div>
<button id="clearfilters" class="btn btn-default">Reset Dashboard</button>
</div>
<div id="total" class="row">
<div class="col-xs-12">
<h4>Number of Refugees and Migrants crossings matching current filters selected: <span id="number"></span></h4>
</div>
</div>
<div class="row">
<div class="col-xs-9">
<div class="row">
<div id="time" class="col-xs-8">
<h4>Time</h4>
<p><button id="timeplay" class="btn btn-default">Animate graph</button>Current filter: <span class="filter"></span></p>
</div>
<div id="entrytype" class="col-xs-4">
<h4>Entry route type</h4>
<p>Current filter: <span class="filter"></span></p>
</div>
</div>
<div class="row">
<h4>Map</h4>
<div id="map" class="col-xs-12"></div>
</div>
</div>
<div class="col-xs-3">
<div class="row">
<div id="country" class="col-xs-12">
<h4>Country of Origin</h4>
<p>Current filter: <span class="filter"></span></p>
</div>
</div>
</div>
</div>
<div>
<div class="xs-col-12">
<p>Source: FRAN data as of 17 August 2015</p>
<p>* This designation is without prejudice to positions on status, and is in line with UNSCR 1244 and the ICJ Opinion on the Kosovo* declaration of independence.</p>
</div>
</div>
</div>
<div id="modal" class="modal fade" role="dialog">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div id="loading" class="modal-body">
<h2>Loading</h2>
</div>
</div>
</div>
</div>
<script src="js/site.js"></script>
</body>
</html>