Store map position in schema

geojupyter · Jul 10, 2024 · 0cf7ea6 · 0cf7ea6
1 parent bf72850
commit 0cf7ea6
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 3 deletions.
diff --git a/packages/base/src/mainview/mainview.tsx b/packages/base/src/mainview/mainview.tsx
@@ -100,6 +100,28 @@ export class MainView extends React.Component<IProps, IStates> {
         container: this.divRef.current
       });
 
+      this._Map.on('zoomend', () => {
+        if (!this._initializedPosition) {
+          return;
+        }
+
+        const zoom = this._Map.getZoom();
+        this._model.setOptions({ ...this._model.getOptions(), zoom });
+      });
+
+      this._Map.on('moveend', () => {
+        if (!this._initializedPosition) {
+          return;
+        }
+
+        const center = this._Map.getCenter();
+        this._model.setOptions({
+          ...this._model.getOptions(),
+          latitude: center.lat,
+          longitude: center.lng
+        });
+      });
+
       this.setState(old => ({ ...old, loading: false }));
     }
   };
@@ -386,7 +408,21 @@ export class MainView extends React.Component<IProps, IStates> {
     sender: IJupyterGISDoc,
     change: MapChange
   ): void {
-    // TODO SOMETHING
+    if (!this._initializedPosition) {
+      const options = this._model.getOptions();
+
+      // It is important to call setZoom first, otherwise maplibre does set the center properly
+      this._Map.setZoom(options.zoom || 0);
+      this._Map.setCenter(
+        (options.longitude &&
+          options.latitude && {
+            lng: options.longitude,
+            lat: options.latitude
+          }) || [0, 0]
+      );
+
+      this._initializedPosition = true;
+    }
   }
 
   private _onViewChanged(
@@ -486,6 +522,7 @@ export class MainView extends React.Component<IProps, IStates> {
     );
   }
 
+  private _initializedPosition = false;
   private divRef = React.createRef<HTMLDivElement>(); // Reference of render div
 
   private _Map: MapLibre.Map;

diff --git a/packages/schema/src/interfaces.ts b/packages/schema/src/interfaces.ts
@@ -146,6 +146,8 @@ export interface IJupyterGISModel extends DocumentRegistry.IModel {
     groupName?: string,
     position?: number
   ): void;
+  getOptions(): IJGISOptions;
+  setOptions(value: IJGISOptions): void;
 
   syncSelected(value: { [key: string]: ISelection }, emitter?: string): void;
   setUserToFollow(userId?: number): void;

diff --git a/packages/schema/src/model.ts b/packages/schema/src/model.ts
@@ -13,7 +13,8 @@ import {
   IJGISLayerGroup,
   IJGISLayerTree,
   IJGISSource,
-  IJGISSources
+  IJGISSources,
+  IJGISOptions
 } from './_interface/jgis';
 import { JupyterGISDoc } from './doc';
 import {
@@ -274,6 +275,14 @@ export class JupyterGISModel implements IJupyterGISModel {
     this._addLayerTreeItem(id, groupName, position);
   }
 
+  setOptions(value: IJGISOptions) {
+    this._sharedModel.options = value;
+  }
+
+  getOptions(): IJGISOptions {
+    return this._sharedModel.options;
+  }
+
   syncSelected(value: { [key: string]: ISelection }, emitter?: string): void {
     this.sharedModel.awareness.setLocalStateField('selected', {
       value,

diff --git a/packages/schema/src/schema/jgis.json b/packages/schema/src/schema/jgis.json
@@ -116,7 +116,20 @@
       "type": "object",
       "default": {},
       "additionalProperties": false,
-      "properties": {}
+      "properties": {
+        "latitude": {
+          "type": "number",
+          "default": 0
+        },
+        "longitude": {
+          "type": "number",
+          "default": 0
+        },
+        "zoom": {
+          "type": "number",
+          "default": 0
+        }
+      }
     },
     "jGISLayerItem": {
       "title": "IJGISLayerItem",