diff --git a/components/src/components/Map/Component.ts b/components/src/components/Map/Component.ts index dee9a5cf1..c32056163 100644 --- a/components/src/components/Map/Component.ts +++ b/components/src/components/Map/Component.ts @@ -72,7 +72,10 @@ export default class Component extends (FieldComponent as any) { drawOptions[this.component.markerType] = true; // set marker type from user choice } - const { numPoints, defaultZoom, readOnlyMap, center } = this.component; + const { numPoints, defaultZoom, readOnlyMap, center, defaultValue } = + this.component; + + const { readOnly: viewMode } = this.options; let initialCenter; @@ -88,6 +91,7 @@ export default class Component extends (FieldComponent as any) { numPoints, defaultZoom, readOnlyMap, + defaultValue, onDrawnItemsChange: this.saveDrawnItems.bind(this), viewMode, }); diff --git a/components/src/components/Map/editForm/Component.edit.data.ts b/components/src/components/Map/editForm/Component.edit.data.ts index 6dbf7d242..74f60d61f 100644 --- a/components/src/components/Map/editForm/Component.edit.data.ts +++ b/components/src/components/Map/editForm/Component.edit.data.ts @@ -63,7 +63,7 @@ export default { numPoints: 1, tableView: false, markerType: 'marker', - defaultZoom: 13, + defaultZoom: 5, readOnlyMap: false, description: 'Please select the desired default center using a single marker', diff --git a/components/src/components/Map/services/MapService.ts b/components/src/components/Map/services/MapService.ts index 9bb43e4c5..06b110b23 100644 --- a/components/src/components/Map/services/MapService.ts +++ b/components/src/components/Map/services/MapService.ts @@ -6,7 +6,7 @@ const DEFAULT_MAP_LAYER_URL = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; const DEFAULT_LAYER_ATTRIBUTION = '© OpenStreetMap contributors'; -const DEFAULT_MAP_ZOOM = 13; +const DEFAULT_MAP_ZOOM = 5; const DECIMALS_LATLNG = 5; // the number of decimals of latitude and longitude to be displayed in the marker popup const COMPONENT_EDIT_CLASS = 'component-edit-tabs'; @@ -48,6 +48,12 @@ class MapService { this.bindPopupToLayer(layer); options.onDrawnItemsChange(drawnItems.getLayers()); }); + map.on(L.Draw.Event.DELETED, (e) => { + options.onDrawnItemsChange(drawnItems.getLayers()); + }); + map.on(L.Draw.Event.EDITED, (e) => { + options.onDrawnItemsChange(drawnItems.getLayers()); + }); } } @@ -94,12 +100,12 @@ class MapService { document.getElementsByClassName(COMPONENT_EDIT_CLASS); if (form) { if (form[0]?.classList.contains('formbuilder')) { + map.invalidateSize(); map.dragging.disable(); map.scrollWheelZoom.disable(); if (this.hasChildNode(componentEditNode[0], mapContainer)) { map.dragging.enable(); map.scrollWheelZoom.enable(); - map.invalidateSize(true); } } }