# Enabling pinch to zoom

**URL:** <https://pdfjs.community/t/enabling-pinch-to-zoom/2254>\
**Category:** Technical Support\
**Tags:** pdfjs-express\
**Created:** [December 22, 2022, 6:19am UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254 "2022-12-22T06:19:51Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 22, 2022, 6:19am UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/1 "2022-12-22T06:19:51Z")

</div>

**Which product are you using?**  
PDF.js Express Viewer on an Angular web app

**PDF.js Express Version**  
8.1.0

**Detailed description of issue**  
I cannot get pinch to zoom working at all. If I double tap on a pdf it zooms in/out and even panning is acting weird. I need to brush my finger across the screen. Tapping and dragging does nothing. I am using a react native webview component on ios and I can confirm pinch to zoom & panning works when viewing other websites including your viewer demo on your website. I feel like Im missing something obvious here but just cant figure it out.

**Expected behaviour**  
Pinch to zoom functionality just like in the viewer demo on your website.

**Does your issue happen with every document, or just one?**  
Everything

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 22, 2022, 6:25am UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/3 "2022-12-22T06:25:48Z")

</div>

One more note. I accessed my express js viewer build through my browser on the same device and pinch to zoom still did not work, so that rules out the react native web-viewer as the culprit.

---

<div class="post-metadata">

**Author:** ![zserviss](https://avatars.discourse-cdn.com/v4/letter/z/a9a28c/32.png) [@zserviss](https://pdfjs.community/u/zserviss)\
**Post date:** [December 22, 2022, 5:43pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/4 "2022-12-22T17:43:20Z")

</div>

Hi @adam.beer

I would recommend to update to the latest version of Express (8.7) and see if this is still an issue.

Best Regards,  
Zach Serviss  
Web Development Support Engineer  
PDFTron Systems, Inc.

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 22, 2022, 6:08pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/5 "2022-12-22T18:08:06Z")

</div>

8.7 still has this issue.

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 22, 2022, 7:40pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/6 "2022-12-22T19:40:06Z")

</div>

@zserviss Im using the Angular app sample. This is reproducible by just using:

> **[GitHub - pdfjs-express/pdfjs-express-viewer-angular-sample](https://github.com/pdfjs-express/pdfjs-express-viewer-angular-sample)**
>
> Contribute to pdfjs-express/pdfjs-express-viewer-angular-sample development by creating an account on GitHub.

I also manually changed to version 8.7 before running `npm install` so I verified that this is still an issue on the latest version.

If you run the Angular app and access it through a mobile device, panning and pinch to zoom are both issues.

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 28, 2022, 1:30am UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/7 "2022-12-28T01:30:02Z")

</div>

@zserviss Any insight as to what could be going on? Id like to avoid having to rewrite my app outside Angular

---

<div class="post-metadata">

**Author:** ![tgordon](https://avatars.discourse-cdn.com/v4/letter/t/aca169/32.png) [@tgordon](https://pdfjs.community/u/tgordon)\
**Post date:** [December 29, 2022, 7:59pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/8 "2022-12-29T19:59:45Z")

</div>

Hello adam.beer,

Can you try with this build here? [Sign in to your account](https://pdftron-my.sharepoint.com/:u:/p/tgordon/Efvykhnnp1BFrIz3dRVezWsBdSRp3sMc-wnIHDT_VjN7HQ?e=P5fhQb)

Best regards,  
TylerGordon

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 30, 2022, 3:34am UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/9 "2022-12-30T03:34:05Z")

</div>

@tgordon I had to add a license key to the viewer sample to get it to work but yes that build worked as expected. This example doesnt seem to be using Angular though and Id really like to keep using Angular so I dont need to re-write my entire web app.

---

<div class="post-metadata">

**Author:** ![adam.beer](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@adam.beer](https://pdfjs.community/u/adam.beer)\
**Post date:** [December 30, 2022, 6:16pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/10 "2022-12-30T18:16:49Z")

</div>

@tgordon Sorry I should have been more specific in my last post. How can I get this working in Angular?

---

<div class="post-metadata">

**Author:** ![kkim](https://avatars.discourse-cdn.com/v4/letter/k/3ab097/32.png) [@kkim](https://pdfjs.community/u/kkim)\
**Post date:** [January 3, 2023, 10:04pm UTC](https://pdfjs.community/t/enabling-pinch-to-zoom/2254/11 "2023-01-03T22:04:28Z")

</div>

Hi there,

I am not too familiar with Angular but could you use a public library like this one:

> **[ngx-pinch-zoom](https://www.npmjs.com/package/ngx-pinch-zoom)**
>
> Pinch zoom component for Angular.. Latest version: 2.6.2, last published: a year ago. Start using ngx-pinch-zoom in your project by running \`npm i ngx-pinch-zoom\`. There are 3 other projects in the npm registry using ngx-pinch-zoom.

We also have a isPinching method available in our PanTool for troubleshooting:  
[https://pdfjs.express/api/Core.Tools.PanTool.html#isPinching\_\_anchor](https://pdfjs.express/api/Core.Tools.PanTool.html#isPinching__anchor)

Best regards,  
Kevin Kim
