drozhzhin-n-e / ngx-pinch-zoom

Module provides for image zooming and positioning with use of gestures on a touch screen.
http://ivylab.space/pinch-zoom
MIT License
113 stars 95 forks source link

Zooming to a specified DOM element #61

Closed ali-kamalizade closed 1 year ago

ali-kamalizade commented 4 years ago

First off - great work! I have tried other solutions but this library works quite well in our Angular application. I am missing a feature that I haven't discovered so far: the ability to programmatically zoom to a DOM element.

My code looks somewhat like this:

<pinch-zoom>
  <svg id="super-large">
    Lot's of other elements in here
   <circle id="scroll-to-me-please"></circle>
  </svg>
</pinch-zoom>

I want to programmatically zoom close to the scroll-to-me-please element.

Any idea how can this already be achieved with the library or could this maybe become a feature of this library?

Thanks in advance!

EDIT: On second look, maybe this feature of the pro version could fulfill my use case. Would something like this work?

@ViewChild('myPinch') myPinch;
zoomToElement(elem) {
  const options = {x: someNumber, y: someNumber, scale: someNumber});
  myPinch.setTransform(options);
}