From faa9eedee439c93c2bd0b6fd67ebd3dd2dc0f6a8 Mon Sep 17 00:00:00 2001
From: dlozic <davidlozic@gmail.com>
Date: Tue, 1 Aug 2023 09:23:28 +0200
Subject: [PATCH 1/2] New: Add zoom and recenter functions

---
 src/views/orb-map-view.ts | 11 +++++++++++
 src/views/orb-view.ts     | 24 ++++++++++++++++++++++++
 2 files changed, 35 insertions(+)

diff --git a/src/views/orb-map-view.ts b/src/views/orb-map-view.ts
index 5bc4d45..0a1a7f2 100644
--- a/src/views/orb-map-view.ts
+++ b/src/views/orb-map-view.ts
@@ -198,6 +198,11 @@ export class OrbMapView<N extends INodeBase, E extends IEdgeBase> implements IOr
     onRendered?.();
   }
 
+  zoomIn(onRendered?: () => void) {
+    this._leaflet.zoomIn();
+    onRendered?.();
+  }
+
   recenter(onRendered?: () => void) {
     const view = this._graph.getBoundingBox();
     const topRightCoordinate = this._leaflet.layerPointToLatLng([view.x, view.y]);
@@ -206,6 +211,11 @@ export class OrbMapView<N extends INodeBase, E extends IEdgeBase> implements IOr
     onRendered?.();
   }
 
+  zoomOut(onRendered?: () => void) {
+    this._leaflet.zoomOut();
+    onRendered?.();
+  }
+
   destroy() {
     this._renderer.removeAllListeners();
     this._leaflet.off();
@@ -240,6 +250,7 @@ export class OrbMapView<N extends INodeBase, E extends IEdgeBase> implements IOr
   private _initLeaflet() {
     const leaflet = L.map(this._map, {
       doubleClickZoom: false,
+      zoomControl: false,
     }).setView([0, 0], this._settings.map.zoomLevel);
 
     leaflet.on('zoomstart', () => {
diff --git a/src/views/orb-view.ts b/src/views/orb-view.ts
index e44a812..4a1f16f 100644
--- a/src/views/orb-view.ts
+++ b/src/views/orb-view.ts
@@ -300,6 +300,18 @@ export class OrbView<N extends INodeBase, E extends IEdgeBase> implements IOrbVi
     onRendered?.();
   }
 
+  zoomIn(onRendered?: () => void) {
+    select(this._canvas)
+      .transition()
+      .duration(this._settings.zoomFitTransitionMs)
+      .ease(easeLinear)
+      .call(this._d3Zoom.scaleBy, 1.2)
+      .call(() => {
+        this._renderer.render(this._graph);
+        onRendered?.();
+      });
+  }
+
   recenter(onRendered?: () => void) {
     const fitZoomTransform = this._renderer.getFitZoomTransform(this._graph);
 
@@ -314,6 +326,18 @@ export class OrbView<N extends INodeBase, E extends IEdgeBase> implements IOrbVi
       });
   }
 
+  zoomOut(onRendered?: () => void) {
+    select(this._canvas)
+      .transition()
+      .duration(this._settings.zoomFitTransitionMs)
+      .ease(easeLinear)
+      .call(this._d3Zoom.scaleBy, 0.8)
+      .call(() => {
+        this._renderer.render(this._graph);
+        onRendered?.();
+      });
+  }
+
   destroy() {
     this._renderer.removeAllListeners();
     this._simulator.terminate();

From 54d87c6b495dd46ab08ffbbb3da2b2ba7ab56c9d Mon Sep 17 00:00:00 2001
From: dlozic <davidlozic@gmail.com>
Date: Tue, 1 Aug 2023 14:16:03 +0200
Subject: [PATCH 2/2] Fix: reuse this.render

---
 src/views/orb-view.ts | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/views/orb-view.ts b/src/views/orb-view.ts
index 4a1f16f..a85cf7a 100644
--- a/src/views/orb-view.ts
+++ b/src/views/orb-view.ts
@@ -307,8 +307,7 @@ export class OrbView<N extends INodeBase, E extends IEdgeBase> implements IOrbVi
       .ease(easeLinear)
       .call(this._d3Zoom.scaleBy, 1.2)
       .call(() => {
-        this._renderer.render(this._graph);
-        onRendered?.();
+        this.render(onRendered);
       });
   }
 
@@ -321,8 +320,7 @@ export class OrbView<N extends INodeBase, E extends IEdgeBase> implements IOrbVi
       .ease(easeLinear)
       .call(this._d3Zoom.transform, fitZoomTransform)
       .call(() => {
-        this._renderer.render(this._graph);
-        onRendered?.();
+        this.render(onRendered);
       });
   }