forked from mapnificent/mapnificent
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathlondon.html
124 lines (122 loc) · 6.83 KB
/
london.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
<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>London at Night</title>
<link rel="icon" type="image/png" href="media/img/favicon.png" />
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if IE]><script src="http://explorercanvas.googlecode.com/svn/trunk/excanvas.js"></script><![endif]-->
<link href="media/css/screen.css" rel="stylesheet" type="text/css" media="screen,projection" />
<link type="text/css" href="media/css/smoothness/jquery-ui.css" rel="stylesheet" />
<meta name="robots" content="index, follow" />
<!-- <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAIIC6NMcawLeTWKvhEPhJEBTCfEqn7ZHAgoqnlvF7Z4lQiS11bBRdBz_D_UyO9BGIJ26Z2y2wK2EDrQ&hl=de"></script> -->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="media/js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="media/js/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<header class="sidenav">
<h1 id="about-header"><img style="vertical-align:middle;margin:10px 0 0;" src="media/img/mapnificent.png" alt="Mapnificent"/></h1>
<h2 style="position:relative;top:-30px;left:90px">London</h2>
<nav class="nav">
<ul>
<li><a class="toggle" href="#about">About</a></li>
</ul>
</nav>
</header>
<section id="hint" class="contentoverlay" style="display:block;width:400px">
<a class="close toggle" href="#hint">close</a>
<h2>Watch out: Alpha Stage</h2>
<p>This software is far from finished and still lacks lots of data.<br/>
You should still play around and try the following:</p>
<ul>
<li>change the time distance of point by using the slider</li>
<li>add more points by clicking on the map</li>
<li>drag points around</li>
<li>use the beautiful "Colored" option</li>
<li>check "Intersect" (Firefox, Opera only) to see intersections</li>
</ul>
<p>Try it now!</p>
</section>
<section id="about" class="vcard contentoverlay">
<a class="close toggle" href="#about">close</a>
<h2 class="center">It's <img style="vertical-align:middle;margin:10px 0 0;" src="media/img/mapnificent.png" alt="Mapnificent"/></h2>
<p>Mapnificent London claims to know all weekend night busses after 1am in London.</p>
<p>It was inspired by <a href="http://mapumental.channel4.com">mapumental</a> and you can read the <a href="http://blog.stefanwehrmeyer.com/post/449810520/mapnificent">full story of Mapnificent on my blog</a>.</p>
<p>Mapnificent is licensed under <a href="http://creativecommons.org/licenses/by-nc-sa/3.0">cc-by-nc-sa</a> and <a href="http://github.com/stefanw/Mapnificent">the code is on GitHub</a>.</p>
<h2>Mapnificent was created by</h2>
<p>
<a class="url" href="http://stefanwehrmeyer.com" title="Stefan Wehrmeyer">
<span class="given-name">Stefan</span>
<span class="family-name">Wehrmeyer</span>
</a><br/>
<span class="adr">
<span class="street-address">Roonstr. 22</span><br/>
<span class="postal-code">12203</span> <span class="locality">Berlin</span>,
<span class="country-name">Germany</span>
</span><br/>
<a href="mailto:mail@mapnificent.de">mail@mapnificent.de</a>
</p>
<p>Follow <a href="http://twitter.com/mapnificent">@mapnificent on Twitter</a>!</p>
</section>
<div id="map"></div>
<div id="controls" class="controlsoverlay"></div>
<div id="message" class="shortoverlay" style="display:none"></div>
<script src="media/js/mapnificent.js?version=0-95" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
// if($.cookie("seenVideo") == null){
// $("#video").show();
// $.cookie("seenVideo", "yes", { path: '/', expires: 28 });
// }
var mapnificent = Mapnificent({"mapStartCenter": {"lat": 51.500515, "lng": -0.128317},
"northwest": {"lat":51.713416, "lng":-0.560303},
"southeast": {"lat":51.273944, "lng":0.346069},
"mapStartZoom": 12,
"layerSettings": {"urbanDistance":
{"defaultStartAtPosition": {"lat": 51.4945146, "lng": -0.146578}
, "darkOverlayColor": "rgba(0,0,0,0.75)"
, "colorMaxAcceptableTime": 120
, "colorBaseGradientColor": 240
, "colorMaxGradientColor" : 120
, "estimatedMaxCalculateCalls": 700000
}
},
"mapStyles": {"Night": [
{
"featureType": "all",
"rules": [{"invert_lightness": "true"}]
}
]},
"startMapStyle": "Night"
});
mapnificent.addLayer("urbanDistance");
$(document).ready(function(){
mapnificent.initMap("map");
jQuery(".toggle").click(function(e){
e.preventDefault();
var obj = jQuery(jQuery(this).attr("href"));
if(obj.css("display") == "none"){
obj.fadeIn(400);
} else {
obj.fadeOut(400);
}
});
});
</script>
<script src="media/layers/london_urbandistance.json?version=0-9" type="text/javascript" charset="utf-8"></script>
<script src="media/layers/urbandistance.js?version=0-9" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-15128105-1");
pageTracker._trackPageview();
} catch(err) {}
</script>
</body>
</html>