CODEWITHSUNDEEP
javascriptsvgpanzoom
B.Muz
B.Muz

Reputation: 11

how to update Viewbox in svg-pan-zoom library?

Im trying to use svg-pan-zoom library, and when zoomin/out and mouse drag mouse x,y position is going wrong, and want to update it but no idea how to do it. this is how I create svgPanZoom:

panZoom(x,y){
   this.panZoomResizer = svgPanZoom('svg',{
      viewportSelector: '.svg-pan-zoom_viewport'
      , panEnabled: true
      , controlIconsEnabled: false
      , zoomEnabled: true
      , dblClickZoomEnabled: false
      , mouseWheelZoomEnabled: true
      , controlIconsEnabled: false
      , preventMouseEventsDefault: true
      , zoomScaleSensitivity: 0.4
      , minZoom: 0.5
      , maxZoom: 10
      , fit: true
      , contain: false
      , center: true
      , eventsListenerElement: document.querySelector('svg .svg-pan-zoom_viewport')
   });
}

and want to send value to update viewbox, but dont know how to set it.

const distX = (snap.xMouse - this.fp.posX);
const distY = (snap.yMouse - this.fp.posY);
this.panZoom(distX, distY);

Upvotes: 1

Views: 644

Answers (1)

bumbu
bumbu

Reputation: 1317

There's a lot of code missing here, so better post the entire function/class. As a guess you probably want to call this.panZoomResizer.panZoom(distX, distY);

Upvotes: 0

Related Questions