diff --git a/docs/config.md b/docs/config.md
index 9526c77..6b7bc3b 100644
--- a/docs/config.md
+++ b/docs/config.md
@@ -408,6 +408,14 @@ and [this Wikipedia article](https://en.wikipedia.org/wiki/Tiled_web_map).
};
```
+### `map.zoomOffset`
+
+Offset the zoom level to account for different tile sizes. For example tiles with a
+size of 512x512 need an offset of -1 and for 1024x1024 an offset of -2.
+
+- Type: [`Number`]
+- Default: `0`
+
### `onLocationChange.fitView`
Whether to re-fit the map's content into view or not when a location update is received.
diff --git a/src/config.js b/src/config.js
index c6aa327..c83319c 100644
--- a/src/config.js
+++ b/src/config.js
@@ -65,6 +65,7 @@ const DEFAULT_CONFIG = {
fillColor: "transparent",
},
url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+ zoomOffset: 0,
},
onLocationChange: {
fitView: false,
diff --git a/src/index.d.ts b/src/index.d.ts
index 9d0183b..081d614 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -56,6 +56,7 @@ interface Config {
fillColor: OptionalColor;
};
url: string;
+ zoomOffset: number;
};
onLocationChange: {
fitView: boolean;
diff --git a/src/views/Map.vue b/src/views/Map.vue
index 40799d3..977f6bb 100644
--- a/src/views/Map.vue
+++ b/src/views/Map.vue
@@ -21,7 +21,7 @@
@@ -156,6 +156,7 @@ export default {
maxNativeZoom: this.$config.map.maxNativeZoom,
url: this.$config.map.url,
zoom: this.$store.state.map.zoom,
+ zoomOffset: this.$config.map.zoomOffset,
circle: {
...this.$config.map.circle,
color: this.$config.map.circle.color || this.$config.primaryColor,