Fix bug in map extent visualization

Open-EO · Jan 5, 2025 · 45cd37c · 45cd37c
1 parent b67495d
commit 45cd37c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/src/components/maps/MapExtentViewer.vue b/src/components/maps/MapExtentViewer.vue
@@ -1,5 +1,5 @@
 <template>
-	<div :id="id">
+	<div :id="id" class="map-extent">
 		<ProgressControl ref="progress" :map="map" />
 	</div>
 </template>
@@ -20,6 +20,15 @@ export default {
 			// geometry: GeoJSON Object (WGS84)
 			type: [Array, Object],
 			default: () => null
+		},
+		fill: {
+			type: Boolean,
+			default: true
+		}
+	},
+	watch: {
+		footprint() {
+			this.renderMap();
 		}
 	},
 	methods: {
@@ -53,7 +62,7 @@ export default {
 
 			await this.createMap(isWebMercatorCompatible ? "EPSG:3857" : "EPSG:4326");
 			this.addBasemaps();
-			this.addExtent(value);
+			this.addExtent(value, this.fill);
 		}
 
 	}

diff --git a/src/components/maps/MapMixin.vue b/src/components/maps/MapMixin.vue
@@ -211,7 +211,7 @@ export default {
 			// Make a bigger extent visible so that user can get a better overview
 			var size = this.map.getSize();
 			if (size && paddingPc > 0) {
-				fitOptions.padding = [size[0]*paddingPc/100, size[1]*paddingPc/100, size[0]*paddingPc/100, size[1]*paddingPc/100];
+				fitOptions.padding = [size[1]*paddingPc/100, size[0]*paddingPc/100, size[1]*paddingPc/100, size[0]*paddingPc/100];
 			}
 			else {
 				fitOptions.padding = [30,30,30,30];