-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
82 lines (78 loc) · 2.27 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
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>OCCUPY DATA</title>
<script src='wax/ext/modestmaps.min.js' type='text/javascript'></script>
<script src='wax/dist/wax.mm.js' type='text/javascript'></script>
<link href='wax/theme/controls.css' rel='stylesheet' type='text/css' />
<style type='text/css'>
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
overflow: hidden;
}
p {
line-height: 20px;
}
a {
color: #29A1E1;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
#mymap {
position: absolute;
top: 0;
right: 400px;
left: 0;
height: 100%;
}
#sidebar {
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 359px;
background: #111;
color: #fff;
border-left:1px solid #000;
padding: 20px;
}
.source {
font-size: 80%;
}
.wax-tooltip {
right: 10px;
left: auto;
}
</style>
</head>
<body>
<div id='sidebar'>
<h2>Banks Eating Banks</h2>
<p>This map shows the mergers and acquisitions of all FDIC-insured banks in the USA from 2007-2012.</p>
<p>Source: <a href="http://www.fdic.gov/">Federal Deposit Insurance Corporation</a></p><br>
<p>An ongoing Occupy Data project. <br>Interested? Check out the Occupy Data <a href="http://thedatahub.org/group/occupy" target="_blank">datastore.</a> Want to join? Email [email protected]</p>
</div>
<div id='mymap'></div>
<script type='text/javascript'>
// Your map's TileJSON url. Define your map layers here.
var url = 'http://api.tiles.mapbox.com/v3/occupy.bankmergers-2007-2012.jsonp';
// Shortening of 'com.modestmaps'
var mm = com.modestmaps;
wax.tilejson(url, function(tilejson) {
// Set up a new map in a div with id 'mymap'
var m = new mm.Map('mymap',
// Add a new map layer with Wax's connector
new wax.mm.connector(tilejson));
// Add zoom controls
wax.mm.zoomer(m, tilejson).appendTo(m.parent);
// Add interactivity (tooltips)
var interaction = wax.mm.interaction(m, tilejson);
// Set the initial center and zoom level
m.setCenterZoom(new mm.Location(39, -98), 5);
});
</script>
</body>
</html>