forked from cutting-room-floor/reinventgreen
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
78 lines (78 loc) · 4.24 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
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<meta name='apple-mobile-web-app-status-bar-style' content='black' />
<meta name='apple-mobile-web-app-capable' content='yes' />
<title>Edifice Maps</title>
<link href='site.css' rel='stylesheet'>
<script src='javascripts/modestmaps.min.js'></script>
<script src='javascripts/wax.mm.min.js'></script>
<script src='javascripts/jquery-1.7.2.min.js'></script>
<script src='javascripts/underscore-min.js'></script>
<script src='site.js'></script>
</head>
<body>
<div id='header' class='gradient'>
<div class='inner'>
<span class='green-data'>Edifice</span>
<h6 class='description'>A showcase of <a href='http://www.encyclopedia.chicagohistory.org/pages/181.html'>Chicago's built environment</a> for <a href='http://www.cnt.org/events/reinventing-chicago/hackathon'>#reinventchi</a> by <a href='http://opencityapps.org'>Cory & Juan</a>.</h6>
<a class='reinventgreen' href='http://hackerleague.org/hackathons/reinvent-green'>#reinventchi</a>
</div>
</div>
<div id='sidebar'>
<div class='inner'>
<div id='layer-switcher'>
<ul>
<li id='buildings-footprints'>
<a class='title' data-layer='jpvelez.buildings' href='#'>Buildings</a>
<div class='description'><span class='arrow'> </span><a href="https://data.cityofchicago.org/Buildings/Building-Footprints/w2v3-isjw">Every building</a> in Chicago, colored by its footprint area.</div>
</li>
<li id='street-trees'>
<a class='title' data-layer='lxbarth.map-e1zsyom9,jpvelez.new_demo_permits' href='#'>Demolitions</a>
<div class='description'><span class='arrow'> </span>All <a href="https://data.cityofchicago.org/Buildings/Demolition-Permits-2012/zkgv-8cwu">buildings demolished </a> since 2006.</div>
</li>
<li id='parks'>
<a class='title' data-layer='jpvelez.new_const_permits' href='#'>Violations</a>
<div class='description'><span class='arrow'> </span>Every <a href="https://data.cityofchicago.org/Buildings/Building-Violations/22u3-xenr">building violation</a> issued by the City of Chicago since 2006.</div>
</li>
<li id='cool-roofs'>
<a class='title' data-layer='lxbarth.map-wpqmws96,jpvelez.construction-spending' href='#'>Construction</a>
<div class='description'><span class='arrow'> </span>Total construction spending by census block group.</div>
</li>
<!-- <li id='energy'>
<a class='title' data-layer='lxbarth.map-v9o1vc83' href='#'>Land Use</a>
<div class='description'><span class='arrow'> </span>What's going on inside every building, according to the <a href="http://www.cmap.illinois.gov/land-use-inventory">Chicago Metropolitain Agency for Planning</a>.</div>
</li> -->
</ul>
</div>
<div class='notes'>
All data from <a href='https://data.cityofchicago.org/'>Chicago's Open Data portal</a> and <a href='http://openstreetmap.org'>OpenStreetMap</a>. Maps designed with <a href='http://mapbox.com/tilemill/'>TileMill</a>, site template by <a href='http://mapbox.com/reinventgreen/'>MapBox</a>. Code is on <a href='https://github.com/jpvelez/reinventchi'>GitHub</a>.
</div>
</div>
</div>
<div id='map' class='fullscreen'>
<div id ='share'>
<a href='#' class='share button'>Share</a>
</div>
</div>
<div class='modal share'>
<div class='modal-box'>
<a href='#' class='close button'>×</a>
<h2>Share</h2>
<div class='tilejson'>
<textarea></textarea>
<h3>TileJSON URL</h3>
Use with a TileJSON <a href='http://mapbox.com/wax/'>Wax</a> connector or the <a href='http://mapbox.com/mobile/'>MapBox iOS SDK</a>.
</div>
<div class='embed'>
<textarea></textarea>
<h3>Embed code</h3>
Copy and paste this HTML into your website or blog to show this map.
</div>
</div>
</div>
<div id='attribution'></div>
</body>
</html>