templates/trip.html

changeset 116
5b6652cd4954
parent 115
9452b9ac69e6
child 117
e7174afc6121
--- a/templates/trip.html	Thu Sep 13 21:34:49 2018 +0300
+++ b/templates/trip.html	Thu Sep 13 22:25:16 2018 +0300
@@ -126,25 +126,55 @@
 	</tbody>
 	</table>
 <script>
-function openBusStop(event) {
-	window.open(this.options._my_bus_stop_url);
+var osm = L.tileLayer(
+	'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
+	{
+		attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors',
+		maxZoom: 19,
+	}
+);
+var tiles = {
+	"OpenStreetMap (Carto)": osm,
+	"MML Peruskartta": L.tileLayer(
+		'http://tiles.kartat.kapsi.fi/peruskartta/{z}/{x}/{y}.jpg',
+		{
+			attribution: 'Map data &copy; Maanmittauslaitos',
+			maxZoom: 19,
+		}
+	),
+	"MML Taustakartta": L.tileLayer(
+		'http://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg',
+		{
+			attribution: 'Map data &copy; Maanmittauslaitos',
+			maxZoom: 19,
+		}
+	),
+	"MML Ortokuva": L.tileLayer(
+		'http://tiles.kartat.kapsi.fi/ortokuva/{z}/{x}/{y}.jpg',
+		{
+			attribution: 'Map data &copy; Maanmittauslaitos',
+			maxZoom: 19,
+		}
+	),
+	"OpenTopoMap": L.tileLayer(
+		'https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png',
+		{
+			attribution: 'Map data &copy; Maanmittauslaitos',
+			maxZoom: 18,
+		}
+	),
 }
+
 var route = [{{shape}}];
-var mymap = L.map('mapid').setView([60.45175, 22.26705], 13);
+var mymap = L.map('mapid', {layers: [osm]}).setView([60.45175, 22.26705], 13);
 var myIcon = L.icon({
     iconUrl: '/static/favicon.png',
     iconSize: [16, 16],
     iconAnchor: [8, 8],
     popupAnchor: [-3, -76],
 });
-L.tileLayer(
-	'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
-	//'http://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg',
-	{
-		attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors',
-		maxZoom: 18,
-	}
-).addTo(mymap);
+
+L.control.layers(tiles).addTo(mymap);
 var polyline = L.polyline(route, {
 	color: 'black',
 	dashArray: [3, 5],
@@ -155,7 +185,7 @@
 {% for entry in schedule %}
 {% for halt in entry['stops'] %}
 marker = L.circleMarker([{{halt["location"]}}], {
-	radius: 6,
+	radius: 12,
 	color: 'black',
 	fillColor: 'yellow',
 	fillOpacity: 1,

mercurial