# Perspective zoom-in and zoom-out with mouse wheel

**URL:** <https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299>\
**Category:** Ignition Early Access\
**Tags:** perspective\
**Created:** [November 28, 2019, 10:40am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299 "2019-11-28T10:40:19Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![sbussolino](https://avatars.discourse-cdn.com/v4/letter/s/5fc32e/32.png) [@sbussolino](https://forum.inductiveautomation.com/u/sbussolino)\
**Post date:** [November 28, 2019, 10:40am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/1 "2019-11-28T10:40:19Z")

</div>

Hello

is there a way to do a zoom in on the page in perspective mode using the mouse wheel?  
To be clear I’m looking for something like zooming in and out over an area in google maps.

I have this SVG map which I would like to zoom with the mouse wheel or wtih the fingers in case of mobile device, and I couldn’t find a way to do that. My problem is that I have another floating SVG “pin” which marks a position and I don’t want this “pin” to change position during the zoom operations.

Any help or suggestion is apreciated.

---

<div class="post-metadata">

**Author:** ![rafi.shaik](https://avatars.discourse-cdn.com/v4/letter/r/43a26b/32.png) [@rafi.shaik](https://forum.inductiveautomation.com/u/rafi.shaik)\
**Post date:** [February 8, 2022, 6:15am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/2 "2022-02-08T06:15:54Z")

</div>

Hi to all  
Please can one help in same requirement like zoom in and out using the mouse wheel.  
I’m having .SVG file with floorplans. Here SVG file drag and drop from my local to designer with selecting Embed image. My exact requirement is zoom in and out with the mouse wheel in the client page.

Thanks!

---

<div class="post-metadata">

**Author:** ![vipo](https://avatars.discourse-cdn.com/v4/letter/v/eada6e/32.png) [@vipo](https://forum.inductiveautomation.com/u/vipo)\
**Post date:** [April 26, 2022, 9:13am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/3 "2022-04-26T09:13:55Z")

</div>

Have you figured this out ?

---

<div class="post-metadata">

**Author:** ![lachguerabdallah](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lachguerabdallah/32/25558_2.png) [@lachguerabdallah](https://forum.inductiveautomation.com/u/lachguerabdallah)\
**Post date:** [April 26, 2022, 11:51am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/4 "2022-04-26T11:51:08Z")

</div>

use css transform: scale()

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 26, 2022, 2:36pm UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/5 "2022-04-26T14:36:48Z")

</div>

css also has zoom

---

<div class="post-metadata">

**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\
**Post date:** [April 26, 2022, 3:58pm UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/6 "2022-04-26T15:58:55Z")

</div>

I added a style, `zoom:` to a root container and then bound to a slider. That works, but to the point of this thread, how do you use the mouse wheel? I would assume the `onWheel` event, but I don’t see this event do anything except for `deltaY` I will get either +100 or -100.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 27, 2022, 6:36am UTC](https://forum.inductiveautomation.com/t/perspective-zoom-in-and-zoom-out-with-mouse-wheel/30299/7 "2022-04-27T06:36:07Z")

</div>

you will have to increase the zoom property if deltay=100 and decrease if -100 then i guess xd
