added zoom and zoomBy call forward to svg-pan-zoom api

src/SvgPanZoom.vue

@@ -23,43 +23,56 @@ import { EventBus } from './EventBus';
 
 import SvgPanZoomThumbnail from './SvgPanZoomThumbnail.vue';
 
+import { SvgPanZoomApi } from './SvgPanZoomApi';
+
 export default {
-    props,
+  components: { SvgPanZoomThumbnail },
-    components: { SvgPanZoomThumbnail },
+  props,
-    computed: {
+  computed: {
-        has_thumbnail: function() { return this.$slots.thumbnail },
+    has_thumbnail: function() { return this.$slots.thumbnail },
-        options: function() {
+    options: function() {
-            let options = {};
+      let options = {};
 
-            const is_defined = k => this[k] !== undefined;
+      const is_defined = k => this[k] !== undefined;
 
-            Object.keys(props)
+      Object.keys(props)
-                .filter( is_defined )
+        .filter( is_defined )
-                .forEach( k => options[k] = this[k] );
+        .forEach( k => options[k] = this[k] );
 
-            return options;
+      return options;
-        }
+    }
+  },
+  data: () => ({
+    spz: null,
+    bus: EventBus()
+  }),
+  mounted: function() {
+    let options = {};
+
+    Object.keys(props).filter( k => this[k] !== undefined ).forEach( k => options[k] = this[k] );
+
+    options.onZoom = (...args) => {
+      this.bus.$emit( 'mainZoom' );
+      if( this.onZoom ) this.onZoom(args);
+    };
+
+    options.onPan = (...args) => {
+      this.bus.$emit( 'mainPan' );
+      if( this.onPan ) this.onPan(args);
+    };
+
+    this.spz = svg_pan_zoom( this.$slots.default[0].elm , options );
+
+    this.$emit( 'svgpanzoom', this.spz );
+  },
+  methods: {
+    zoom: function( v ){
+      this.spz.zoom( v );
     },
-    mounted: function() {
+    zoomBy: function( v ){
-        let options = {};
+      this.spz.zoomBy( v );
-
+    }
-        Object.keys(props).filter( k => this[k] !== undefined ).forEach( k => options[k] = this[k] );
+  }
-
-        options.onZoom = (...args) => {
-            this.bus.$emit( 'mainZoom' );
-            if( this.onZoom ) this.onZoom(args);
-        };
-
-        options.onPan = (...args) => {
-            this.bus.$emit( 'mainPan' );
-            if( this.onPan ) this.onPan(args);
-        };
-
-        this.spz = svg_pan_zoom( this.$slots.default[0].elm , options );
-
-        this.$emit( 'svgpanzoom', this.spz );
-    },
-    data: () => ({ spz: null, bus: EventBus() }),
 };
 
 </script>

src/SvgPanZoomApi.js

@@ -0,0 +1,6 @@
+export const SvgPanZoomApi = ( SvgPanZoomInstance ) => ({
+  zoom: function( v ){
+    SvgPanZoomInstance.zoom( v );
+  },
+  zoomBy: ( v ) => SvgPanZoomInstance.zoomBy( v )
+});