Replace map initial center/zoom config with auto fitting

Closes #23

docs/config.md

@@ -29,9 +29,6 @@ window.owntracks.config = {};
 - [`locale`](#locale)
 - `map`
   - [`attribution`](#mapattribution)
-  - `center`
-    - [`lat`](#mapcenterlat)
-    - [`lng`](#mapcenterlng)
   - [`circle`](#mapcircle)
   - [`circleMarker`](#mapcirclemarker)
   - `controls`
@@ -59,7 +56,6 @@ window.owntracks.config = {};
   - [`maxZoom`](#mapmaxzoom)
   - [`polyline`](#mappolyline)
   - [`url`](#mapurl)
-  - [`zoom`](#mapzoom)
 - `onLocationChange`
   - [`reloadHistory`](#onlocationchangereloadhistory)
 - [`primaryColor`](#primarycolor)
@@ -154,20 +150,6 @@ Attribution for map tiles.
   };
   ```
 
-### `map.center.lat`
-
-Initial map center latitude.
-
-- Type: [`Number`]
-- Default: `0`
-
-### `map.center.lng`
-
-Initial map center longitude.
-
-- Type: [`Number`]
-- Default: `0`
-
 ### `map.circle`
 
 Location accuracy indicator configuation. `color` and `fillColor` default to
@@ -378,13 +360,6 @@ and [this Wikipedia article](https://en.wikipedia.org/wiki/Tiled_web_map).
   };
   ```
 
-### `map.zoom`
-
-Initial map zoom level.
-
-- Type: [`Number`]
-- Default: `19`
-
 ### `onLocationChange.reloadHistory`
 
 Whether to reload the location history (of selected date range) or not when a location

src/config.js

@@ -17,10 +17,6 @@ const DEFAULT_CONFIG = {
   map: {
     attribution:
       '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors',
-    center: {
-      lat: 0,
-      lng: 0,
-    },
     circle: {
       color: null,
       fillColor: null,
@@ -65,7 +61,6 @@ const DEFAULT_CONFIG = {
       fillColor: "transparent",
     },
     url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
-    zoom: 19,
   },
   onLocationChange: {
     reloadHistory: false,

src/store/index.js

@@ -23,8 +23,11 @@ export default new Vuex.Store({
     startDateTime: config.startDateTime.toISOString().slice(0, 19),
     endDateTime: config.endDateTime.toISOString().slice(0, 19),
     map: {
-      center: config.map.center,
-      zoom: config.map.zoom,
+      center: {
+        lat: 0,
+        lng: 0,
+      },
+      zoom: 19,
       layers: config.map.layers,
     },
     distanceTravelled: null,

src/views/Map.vue

@@ -232,5 +232,13 @@ export default {
       }));
     },
   },
+  watch: {
+    lastLocations() {
+      this.fitView();
+    },
+    locationHistory() {
+      this.fitView();
+    },
+  },
 };
 </script>