center to origin node in LibraryTree

src/components/layouts/MapZoom.vue

@@ -24,7 +24,8 @@ export default {
     id: { type: String, required: true },
     minZoom: { type: Number, default: 0.3 },
     maxZoom: { type: Number, default: 1 },
-    initialZoom: { type: Number, default: 1 }
+    initialZoom: { type: Number, default: 1 },
+    center: { type: Object, default: null }
   },
 
   data () {
@@ -46,6 +47,12 @@ export default {
     }
   },
 
+  watch: {
+    center (val, prevVal) {
+      this.transform = this.transform.translate(prevVal.x - val.x, prevVal.y - val.y)
+    }
+  },
+
   methods: {
     updateSize () {
       const { width, height } = this.$el.getBoundingClientRect()
@@ -67,7 +74,7 @@ export default {
     window.addEventListener('resize', () => this.updateSize())
 
     this.zoom.on('zoom', ({ transform }) => {
-      this.transform = transform
+      this.transform = this.center ? transform.translate(-this.center.x, -this.center.y) : transform
       this.scale = transform.k
     })