forked from rhiever/optimal-roadtrip-usa
-
Notifications
You must be signed in to change notification settings - Fork 0
/
europe-trip3.html
125 lines (118 loc) · 5.61 KB
/
europe-trip3.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
125
<!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" />
<title>The optimal trip</title>
<style>
html, body, #map {height: 100%;margin:0;padding:0;}
</style>
<script src="//maps.googleapis.com/maps/api/js?v=3"></script>
<script>
// put your optimized route in this array!
var optimizedRoute = [
"Bru na Boinne, Meath, Ireland",
"Edinburgh Castle, Castlehill, Edinburgh, United Kingdom",
"Stonehenge, Amesbury, United Kingdom",
"Mont Saint-Michel, France",
"Chateau de Versailles, Versailles, France",
"Eiffel Tower, Paris, France",
"Chateau de Fontainebleau, Fontainebleau, France",
"Real Sitio de San Lorenzo de El Escorial, San Lorenzo de El Escorial, Spain",
"Batalha Kloster, Largo Infante Dom Henrique, Batalha, Portugal",
"Alhambra, Calle Real de la Alhambra, Granada, Spain",
"Sagrada Familia, Carrer de Mallorca, Barcelona, Spain",
"Vall del Madriu-Perafita-Claror, Les Escaldes, Andorra",
"Leaning Tower of Pisa, Pisa, Italy",
"Piazza S. Pietro, Vatican City",
"Colosseum, Piazza del Colosseo, Rome, Italy",
"it-Tempji tal-Ggantija, Triq Parsott, Xaghra, Malta",
"Old Town Dubrovnik, Dubrovnik, Croatia",
"Kotor, Montenegro",
"Old Bridge, Mostar, Federation of Bosnia and Herzegovina, Bosnia and Herzegovina",
"Studenica Monastery, Brezova, Serbia",
"Kloster Rila, Rilski manastir, Bulgaria",
"Ohrid, Macedonia (FYROM)",
"Berat, Albania",
"Acropolis of Athens, Athens, Kentrikos Tomeas Athinon, Greece",
"Hagia Sophia Museum, Istanbul, Turkey",
"Manastirea Humorului, Suceava County, Romania",
"Budai varnegyed, Budapest, Hungary",
"Old Town, Prague, Czech Republic",
"Museumsinsel, Berlin, Germany",
"Schloss Kronborg, Kronborg, Helsingor, Denmark",
"Naeroyfjord, Aurland, Norway",
"Bryggen, Bergen, Norway",
"Drottningholm Palace, Drottningholm, Sweden",
"Old Town Riga, Laipu iela, Riga, Rigas pilseta, Latvia",
"Russia, Moscow, Red Square",
"Hermitage Museum, Saint Petersburg, Russia",
"Petaejaeveden vanha kirkko, Vanhankirkontie, Petaejaevesi, Finland",
"Old Town of Tallinn, Tallinn, Tallinna linn, Estonia",
"Kernave, Vilnius County, Lithuania",
"Mir Castle Complex, Cyrvonaarmiejskaja vulica, Mir, Grodno Region, Belarus",
"St. Sophia's Cathedral, Volodymyrska Street, Kyiv, Ukraine",
"Stare Miasto, Krakow, Poland",
"Wieliczka Salt Mine, Wieliczka, Poland",
"Spis Castle, Zehra, Slovakia",
"Schoenbrunn Palace, Vienna, Austria",
"Skocjanske jame, Matavun, Slovenia",
"Ponte di Rialto, Venice, Italy",
"Altstadt von Salzburg, Salzburg, Austria",
"Neuschwanstein Castle, Bavaria, Germany",
"Zytglogge, Bim Zytglogge, Bern, Switzerland",
"Luxembourg City, Luxembourg",
"Cologne Cathedral, Cologne, Germany",
"Kinderdijk-elshouti malomrendszer, Netherlands",
"Grote Markt, Brussels, Belgium",
"Buckingham Palace, London, United Kingdom"
];
// no need to edit below this line
if(optimizedRoute.length > 1) optimizedRoute.push(optimizedRoute[0]);
var optimizedArray = [],
nrItems = 10,
nrSets = Math.ceil(optimizedRoute.length/nrItems);
for(var i=0;i<nrSets;i++) {
var subset = optimizedRoute.slice(i*(nrItems-1),(i*(nrItems-1))+nrItems),
start = subset.shift(),
end = subset.pop();
optimizedArray.push({start: start, end: end, waypoints: []});
if(subset.length) {
for(var j=0;j<subset.length;j++) optimizedArray[optimizedArray.length - 1].waypoints.push(subset[j]);
}
}
var map,
dirDisplay = [],
dirService = new google.maps.DirectionsService(),
bbox = new google.maps.LatLngBounds();
function initialize() {
var center = new google.maps.LatLng(0,0);
var mapOptions = {zoom:3,center: center};
map = new google.maps.Map(document.getElementById('map'), mapOptions);
for(var i=0;i<optimizedArray.length;i++) calcRoute(optimizedArray[i].start,optimizedArray[i].end,optimizedArray[i].waypoints);
}
function calcRoute(start,end,waypoints) {
var stopovers = [];
for (var i=0; i<waypoints.length;i++) stopovers.push({location:waypoints[i],stopover:true});
var request = {origin: start, destination: end, waypoints: stopovers, optimizeWaypoints: false, travelMode: google.maps.TravelMode.DRIVING};
dirService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
dirDisplay.push(new google.maps.DirectionsRenderer({map:map,preserveViewport:true,markerOptions:{icon: "//maps.gstatic.com/mapfiles/markers2/marker.png"}}));
google.maps.event.addListener(dirDisplay[dirDisplay.length - 1], 'directions_changed', function() {
if(dirDisplay.length == nrSets) map.fitBounds(bbox);
})
if(response.routes.length) bbox.union(response.routes[0].bounds);
dirDisplay[dirDisplay.length - 1].setDirections(response);
}
});
}
google.maps.event.addDomListener(window, 'load', initialize);
window.onresize = function() {
if(map != null) map.fitBounds(bbox);
}
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>