diff --git a/apis/interactive_maps.py b/apis/interactive_maps.py
index b4684cc..3fd51ce 100644
--- a/apis/interactive_maps.py
+++ b/apis/interactive_maps.py
@@ -5,26 +5,48 @@ class SwissMap:
def __init__(self) -> None:
self.m = folium.Map(location=[46.8132, 8.2242], tiles='OpenStreetMap', zoom_start=7.6, min_zoom = 6, max_zoom = 12)
-
+
# Returns travel map of customer as html string
- def customer_map(self, customer_id, location_list):
+ def travel_history_map(self, customer_id, location_list):
local_m = self.m
for place, coordinates in location_list:
folium.Marker(
location=coordinates, # coordinates for the marker
popup=place, # pop-up label for the marker
- icon=folium.Icon(color="red")#, icon_color = 'red', icon="fa-map-marker-alt", prefix='fa')
+ icon=folium.Icon(color="red")
).add_to(local_m)
- local_m.save(f'static/swissmap_customer={customer_id}.html')
- return(f'static/swissmap_customer={customer_id}.html')
+ local_m.save(f'static/travelhistorymap_customer{customer_id}.html')
+ return(f'static/travelhistorymap_customer{customer_id}.html')
-# Working example
-"""
+ # own_location and destination are tuples in form (coordinates, place)
+ def destination_map(self, customer_id, own_location, destination):
+ local_m = self.m
+ folium.Marker(
+ location=destination[1], # coordinates for the marker
+ popup=destination[0], # pop-up label for the marker
+ icon=folium.Icon(color="green")
+ ).add_to(local_m)
+ folium.Marker(
+ location=destination[1], # coordinates for the marker
+ popup=destination[0], # pop-up label for the marker
+ icon=folium.Icon(color="red")
+ ).add_to(local_m)
+ local_m.save(f'static/destinationmap_customer={customer_id}_destination{destination[0]}.html')
+ return(f'static/destinationmap_customer={customer_id}_destination{destination[0]}.html')
+
+
+
+# Working examples for travel history map and destination map
+
# Hard coded location list
location_list = [('Center of Switzerland' , [46.8132, 8.2242]), ('Zermatt', [46.11654, 7.445683])]
customer_id = 235
-cmap = SwissMap()
-cmap.customer_map(customer_id, location_list)
-"""
+# Travel history
+thmap = SwissMap()
+thmap.travel_history_map(customer_id, location_list)
+
+# Destination
+dmap = SwissMap()
+dmap.destination_map(customer_id, location_list[0], location_list[1])
diff --git a/static/destinationmap_customer=235_destinationZermatt.html b/static/destinationmap_customer=235_destinationZermatt.html
new file mode 100644
index 0000000..78e33d8
--- /dev/null
+++ b/static/destinationmap_customer=235_destinationZermatt.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+
+ <script>
+ L_NO_TOUCH = false;
+ L_DISABLE_3D = false;
+ </script>
+
+ <style>html, body {width: 100%;height: 100%;margin: 0;padding: 0;}</style>
+ <style>#map {position:absolute;top:0;bottom:0;right:0;left:0;}</style>
+ <script src="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.js"></script>
+ <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"/>
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.css"/>
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/python-visualization/folium/folium/templates/leaflet.awesome.rotate.min.css"/>
+
+ <meta name="viewport" content="width=device-width,
+ initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+ <style>
+ #map_b701048f05f8433f916238ad451ead9e {
+ position: relative;
+ width: 100.0%;
+ height: 100.0%;
+ left: 0.0%;
+ top: 0.0%;
+ }
+ </style>
+
+</head>
+<body>
+
+ <div class="folium-map" id="map_b701048f05f8433f916238ad451ead9e" ></div>
+
+</body>
+<script>
+
+ var map_b701048f05f8433f916238ad451ead9e = L.map(
+ "map_b701048f05f8433f916238ad451ead9e",
+ {
+ center: [46.8132, 8.2242],
+ crs: L.CRS.EPSG3857,
+ zoom: 7.6,
+ zoomControl: true,
+ preferCanvas: false,
+ }
+ );
+
+
+
+
+
+ var tile_layer_103d661571e847a2b745c5a1e69c09d3 = L.tileLayer(
+ "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+ {"attribution": "Data by \u0026copy; \u003ca href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 12, "maxZoom": 12, "minZoom": 6, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
+ ).addTo(map_b701048f05f8433f916238ad451ead9e);
+
+
+ var marker_beee87cd35034028ab299e35349249df = L.marker(
+ [46.11654, 7.445683],
+ {}
+ ).addTo(map_b701048f05f8433f916238ad451ead9e);
+
+
+ var icon_d5a01419ab0c4b83b1b6d47167511bc7 = L.AwesomeMarkers.icon(
+ {"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "green", "prefix": "glyphicon"}
+ );
+ marker_beee87cd35034028ab299e35349249df.setIcon(icon_d5a01419ab0c4b83b1b6d47167511bc7);
+
+
+ var popup_a8a29b98a2b442b481061d3ca1120ec2 = L.popup({"maxWidth": "100%"});
+
+
+ var html_b782302722f94830a783f53c204a57c7 = $(`<div id="html_b782302722f94830a783f53c204a57c7" style="width: 100.0%; height: 100.0%;">Zermatt</div>`)[0];
+ popup_a8a29b98a2b442b481061d3ca1120ec2.setContent(html_b782302722f94830a783f53c204a57c7);
+
+
+ marker_beee87cd35034028ab299e35349249df.bindPopup(popup_a8a29b98a2b442b481061d3ca1120ec2)
+ ;
+
+
+
+
+ var marker_2ba3962a3d0645f180e621dacc7c2be5 = L.marker(
+ [46.11654, 7.445683],
+ {}
+ ).addTo(map_b701048f05f8433f916238ad451ead9e);
+
+
+ var icon_bd7c6c1ec5bb417580238125cf97b5ad = L.AwesomeMarkers.icon(
+ {"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
+ );
+ marker_2ba3962a3d0645f180e621dacc7c2be5.setIcon(icon_bd7c6c1ec5bb417580238125cf97b5ad);
+
+
+ var popup_a013a69b0826485ebd6de9e92e23f5d8 = L.popup({"maxWidth": "100%"});
+
+
+ var html_2fff8d7d90e14a05b0391089c4b8febe = $(`<div id="html_2fff8d7d90e14a05b0391089c4b8febe" style="width: 100.0%; height: 100.0%;">Zermatt</div>`)[0];
+ popup_a013a69b0826485ebd6de9e92e23f5d8.setContent(html_2fff8d7d90e14a05b0391089c4b8febe);
+
+
+ marker_2ba3962a3d0645f180e621dacc7c2be5.bindPopup(popup_a013a69b0826485ebd6de9e92e23f5d8)
+ ;
+
+
+
+</script>
\ No newline at end of file
diff --git a/static/swissmap_customer=235.html b/static/swissmap_customer=235.html
index 4f47aa0..aad1b57 100644
--- a/static/swissmap_customer=235.html
+++ b/static/swissmap_customer=235.html
@@ -23,7 +23,7 @@
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<style>
- #map_fbf1958a9a6d425496ca28d758d8c98b {
+ #map_092483588e2c4ac5924c3622b8af1134 {
position: relative;
width: 100.0%;
height: 100.0%;
@@ -35,13 +35,13 @@
</head>
<body>
- <div class="folium-map" id="map_fbf1958a9a6d425496ca28d758d8c98b" ></div>
+ <div class="folium-map" id="map_092483588e2c4ac5924c3622b8af1134" ></div>
</body>
<script>
- var map_fbf1958a9a6d425496ca28d758d8c98b = L.map(
- "map_fbf1958a9a6d425496ca28d758d8c98b",
+ var map_092483588e2c4ac5924c3622b8af1134 = L.map(
+ "map_092483588e2c4ac5924c3622b8af1134",
{
center: [46.8132, 8.2242],
crs: L.CRS.EPSG3857,
@@ -55,57 +55,57 @@
- var tile_layer_c3ffe5cf42ea484eae3a3f809a74cd8b = L.tileLayer(
+ var tile_layer_3ec4b3b1853e4987b667905c6ee46bd4 = L.tileLayer(
"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
{"attribution": "Data by \u0026copy; \u003ca href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 12, "maxZoom": 12, "minZoom": 6, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
- ).addTo(map_fbf1958a9a6d425496ca28d758d8c98b);
+ ).addTo(map_092483588e2c4ac5924c3622b8af1134);
- var marker_10d611e500dc427c834a790d1b97e505 = L.marker(
+ var marker_c066dc7694ab4b9e9fd55be869c0fb43 = L.marker(
[46.8132, 8.2242],
{}
- ).addTo(map_fbf1958a9a6d425496ca28d758d8c98b);
+ ).addTo(map_092483588e2c4ac5924c3622b8af1134);
- var icon_a8224dce629147bdb7c295277c3b72ad = L.AwesomeMarkers.icon(
+ var icon_01dba90ea2af47ea88ed77a52322effb = L.AwesomeMarkers.icon(
{"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
);
- marker_10d611e500dc427c834a790d1b97e505.setIcon(icon_a8224dce629147bdb7c295277c3b72ad);
+ marker_c066dc7694ab4b9e9fd55be869c0fb43.setIcon(icon_01dba90ea2af47ea88ed77a52322effb);
- var popup_4f9d80be97684a9785a38114ec89d3e9 = L.popup({"maxWidth": "100%"});
+ var popup_4db25cb18ec545efbde0b7251804cae4 = L.popup({"maxWidth": "100%"});
- var html_d11800124ed140ca96e23d857bf8c79c = $(`<div id="html_d11800124ed140ca96e23d857bf8c79c" style="width: 100.0%; height: 100.0%;">Center of Switzerland</div>`)[0];
- popup_4f9d80be97684a9785a38114ec89d3e9.setContent(html_d11800124ed140ca96e23d857bf8c79c);
+ var html_edaa011c18c648a093b0f3b96bc9e7d1 = $(`<div id="html_edaa011c18c648a093b0f3b96bc9e7d1" style="width: 100.0%; height: 100.0%;">Center of Switzerland</div>`)[0];
+ popup_4db25cb18ec545efbde0b7251804cae4.setContent(html_edaa011c18c648a093b0f3b96bc9e7d1);
- marker_10d611e500dc427c834a790d1b97e505.bindPopup(popup_4f9d80be97684a9785a38114ec89d3e9)
+ marker_c066dc7694ab4b9e9fd55be869c0fb43.bindPopup(popup_4db25cb18ec545efbde0b7251804cae4)
;
- var marker_b279c0ad93b8434e82a2f8ad04c44410 = L.marker(
+ var marker_a70d653c5f63441bbbdda56d55a1fd9a = L.marker(
[46.11654, 7.445683],
{}
- ).addTo(map_fbf1958a9a6d425496ca28d758d8c98b);
+ ).addTo(map_092483588e2c4ac5924c3622b8af1134);
- var icon_e20f45b916b24af2a57636f0b07c9b50 = L.AwesomeMarkers.icon(
+ var icon_dba68870c65f416583684126793cfbb4 = L.AwesomeMarkers.icon(
{"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
);
- marker_b279c0ad93b8434e82a2f8ad04c44410.setIcon(icon_e20f45b916b24af2a57636f0b07c9b50);
+ marker_a70d653c5f63441bbbdda56d55a1fd9a.setIcon(icon_dba68870c65f416583684126793cfbb4);
- var popup_a38e82f91c4c426d90d52fdff61cadb3 = L.popup({"maxWidth": "100%"});
+ var popup_0d9507747ef94271a44340243a8aed20 = L.popup({"maxWidth": "100%"});
- var html_9a8a045933d24237a4e3ad59740e47e0 = $(`<div id="html_9a8a045933d24237a4e3ad59740e47e0" style="width: 100.0%; height: 100.0%;">Zermatt</div>`)[0];
- popup_a38e82f91c4c426d90d52fdff61cadb3.setContent(html_9a8a045933d24237a4e3ad59740e47e0);
+ var html_304ce481b37f4636ac95f95ef203e2a9 = $(`<div id="html_304ce481b37f4636ac95f95ef203e2a9" style="width: 100.0%; height: 100.0%;">Zermatt</div>`)[0];
+ popup_0d9507747ef94271a44340243a8aed20.setContent(html_304ce481b37f4636ac95f95ef203e2a9);
- marker_b279c0ad93b8434e82a2f8ad04c44410.bindPopup(popup_a38e82f91c4c426d90d52fdff61cadb3)
+ marker_a70d653c5f63441bbbdda56d55a1fd9a.bindPopup(popup_0d9507747ef94271a44340243a8aed20)
;
diff --git a/static/travelhistorymap_customer235.html b/static/travelhistorymap_customer235.html
new file mode 100644
index 0000000..81670b0
--- /dev/null
+++ b/static/travelhistorymap_customer235.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+
+ <script>
+ L_NO_TOUCH = false;
+ L_DISABLE_3D = false;
+ </script>
+
+ <style>html, body {width: 100%;height: 100%;margin: 0;padding: 0;}</style>
+ <style>#map {position:absolute;top:0;bottom:0;right:0;left:0;}</style>
+ <script src="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.js"></script>
+ <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"/>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"/>
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.css"/>
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/python-visualization/folium/folium/templates/leaflet.awesome.rotate.min.css"/>
+
+ <meta name="viewport" content="width=device-width,
+ initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+ <style>
+ #map_9f412d0133c04e4cb11e6432fb576de7 {
+ position: relative;
+ width: 100.0%;
+ height: 100.0%;
+ left: 0.0%;
+ top: 0.0%;
+ }
+ </style>
+
+</head>
+<body>
+
+ <div class="folium-map" id="map_9f412d0133c04e4cb11e6432fb576de7" ></div>
+
+</body>
+<script>
+
+ var map_9f412d0133c04e4cb11e6432fb576de7 = L.map(
+ "map_9f412d0133c04e4cb11e6432fb576de7",
+ {
+ center: [46.8132, 8.2242],
+ crs: L.CRS.EPSG3857,
+ zoom: 7.6,
+ zoomControl: true,
+ preferCanvas: false,
+ }
+ );
+
+
+
+
+
+ var tile_layer_0592c151fded464b8ea84cfbf78012ee = L.tileLayer(
+ "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+ {"attribution": "Data by \u0026copy; \u003ca href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 12, "maxZoom": 12, "minZoom": 6, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
+ ).addTo(map_9f412d0133c04e4cb11e6432fb576de7);
+
+
+ var marker_0c80bf0358324e1c80fd5190416c59f7 = L.marker(
+ [46.8132, 8.2242],
+ {}
+ ).addTo(map_9f412d0133c04e4cb11e6432fb576de7);
+
+
+ var icon_1bd7c0a756224987a078c8c7e23ff5d5 = L.AwesomeMarkers.icon(
+ {"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
+ );
+ marker_0c80bf0358324e1c80fd5190416c59f7.setIcon(icon_1bd7c0a756224987a078c8c7e23ff5d5);
+
+
+ var popup_86c1972da0984da7b723bf3ab1b48c5a = L.popup({"maxWidth": "100%"});
+
+
+ var html_086c037b7ad040ffb69dd27b6b2c45d3 = $(`<div id="html_086c037b7ad040ffb69dd27b6b2c45d3" style="width: 100.0%; height: 100.0%;">Center of Switzerland</div>`)[0];
+ popup_86c1972da0984da7b723bf3ab1b48c5a.setContent(html_086c037b7ad040ffb69dd27b6b2c45d3);
+
+
+ marker_0c80bf0358324e1c80fd5190416c59f7.bindPopup(popup_86c1972da0984da7b723bf3ab1b48c5a)
+ ;
+
+
+
+
+ var marker_0f1166d399cc43c480a96ee61f367325 = L.marker(
+ [46.11654, 7.445683],
+ {}
+ ).addTo(map_9f412d0133c04e4cb11e6432fb576de7);
+
+
+ var icon_ec0f924a0ff34c2b80aaec432cef3054 = L.AwesomeMarkers.icon(
+ {"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
+ );
+ marker_0f1166d399cc43c480a96ee61f367325.setIcon(icon_ec0f924a0ff34c2b80aaec432cef3054);
+
+
+ var popup_f54e4ca89ed0415f824886e7b27d5d9f = L.popup({"maxWidth": "100%"});
+
+
+ var html_5c80b60971604eb6b3a5e3442618c5b3 = $(`<div id="html_5c80b60971604eb6b3a5e3442618c5b3" style="width: 100.0%; height: 100.0%;">Zermatt</div>`)[0];
+ popup_f54e4ca89ed0415f824886e7b27d5d9f.setContent(html_5c80b60971604eb6b3a5e3442618c5b3);
+
+
+ marker_0f1166d399cc43c480a96ee61f367325.bindPopup(popup_f54e4ca89ed0415f824886e7b27d5d9f)
+ ;
+
+
+
+</script>
\ No newline at end of file