show train route on map2.5.0

1 files changed, 54 insertions, 0 deletions

diff --git a/templates/route_map.html.ep b/templates/route_map.html.ep
new file mode 100644
index 0000000..505cddb
--- /dev/null
+++ b/templates/route_map.html.ep
@@ -0,0 +1,54 @@
+% if (0) {
+  <div class="container">
+    <div class="error">
+      <strong>Fehler!</strong>
+		Baz
+    </div>
+  </div>
+% }
+% else {
+  <div class="container">
+		<div id="map" style="height: 500px;">
+		</div>
+	</div>
+
+<script>
+var map = L.map('map').setView([51.306, 9.712], 6);
+
+L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+}).addTo(map);
+var stations = [
+% for my $station ( @{stash('station_coordinates') // [] } ) {
+[[<%= $station->[0][0] %>,<%= $station->[0][1] %>],'<%= $station->[1] %>'],
+% }
+];
+
+var routes = [];
+var pl;
+% for my $line_group ( @{ stash('polyline_groups') // [] } ) {
+	routes = [
+		% for my $pair ( @{$line_group->{polylines} // []} ) {
+			[[<%= $pair->[0][0] %>,<%= $pair->[0][1] %>],[<%= $pair->[1][0] %>,<%= $pair->[1][1] %>]],
+		% }
+	];
+	pl = L.polyline(routes, {color: '<%= $line_group->{color} %>', opacity: <%= $line_group->{opacity} %>}).addTo(map);
+	% if ($line_group->{fit_bounds}) {
+		if (routes.length) {
+			map.fitBounds(pl.getBounds());
+		}
+	% }
+% }
+
+for (var station_id in stations) {
+	L.circle(stations[station_id][0], {
+		color: '#f03',
+		opacity: 0.7,
+		fillColor: '#f03',
+		fillOpacity: 0.5,
+		radius: 250
+	}).bindPopup(stations[station_id][1]).addTo(map);
+}
+
+</script>
+% }