Added center zoom update

esridc · Jul 17, 2023 · a02a174 · a02a174
1 parent a42091e
commit a02a174
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 1 deletion.
diff --git a/src/components/hub-compass-map/hub-compass-map.tsx b/src/components/hub-compass-map/hub-compass-map.tsx
@@ -67,6 +67,21 @@ export class HubCompassMap {
     });
   }
 
+  @Watch('center')
+  async updateCenter(newCenter) {
+    this.mapView.goTo({
+      center: newCenter,
+      zoom: this.zoom
+    });
+  }
+  @Watch('zoom')
+  async updateZoom(newZoom) {
+    this.mapView.goTo({
+      center: this.center,
+      zoom: newZoom
+    });
+  }
+
   async addDatasetToMap(datasetId) {
 
     const datasetLayer = await new FeatureLayer({

diff --git a/src/index.html b/src/index.html
@@ -38,6 +38,11 @@
     >
       Add Schools
     </calcite-button>
+    <calcite-button 
+      onclick="moveMap([-75,39], 10)"
+    >
+      Move Map
+    </calcite-button>    
   </div>
 
   <style>
@@ -82,7 +87,12 @@
     componentEl.datasetIds = ['7c6443b23d364689be9b34324e6c677d'];
     componentEl.showLayers = true;
     componentEl.showSearch = true;
-
+
+    function moveMap(center, zoom) {
+      componentEl.center = center;
+      componentEl.zoom = zoom;
+    }
+
     function addDatasets(datasetId) {
       console.log("addDatasets", componentEl.datasetIds.concat([datasetId]))
       componentEl.datasetIds = componentEl.datasetIds.concat([datasetId]);