We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Mousewheel Zooming without pressing CTRL

Thread ID:

Created:

Updated:

Platform:

Replies:

151159 Feb 2,2020 11:30 AM UTC Feb 6,2020 03:44 AM UTC Blazor 3
loading
Tags: Diagram
Manuel
Asked On February 2, 2020 11:30 AM UTC

Hi,

i'd like to zoom in / out by using the mouse wheel
without the need to press CTRL or any other control key.
Is there any option to do this?

Regards
Manuel

Shyam G [Syncfusion]
Replied On February 4, 2020 12:52 PM UTC

Hi Manuel, 
 
We should bind the onmousewheel event for the diagram parent div element to perform zooming by using the mousewheel without pressing ctrl key. Please refer to a code example below. 
 
Code example: 
  
<div style="width:1000px;height:1000px"  @onmousewheel="@Mousewheel">      
 
<EjsDiagram @ref="@diagram" Width="100%" Height="100%" Nodes="NodeCollection" Connectors="ConnectorCollection"> </EjsDiagram>  
</div> 
 
public void Mousewheel(WheelEventArgs args)
    {
        if(args.DeltaY < 1)
        {
 
//zoom in the diagram
            diagram.ZoomTo(new ZoomOptions() { Type = ZoomTypes.ZoomIn });
        }
        else
        {
 
//zoom out the diagram
            diagram.ZoomTo(new ZoomOptions() { Type = ZoomTypes.ZoomOut });
        }
    }
 
 
 
 
Regards, 
Shyam G 


Manuel
Replied On February 5, 2020 10:11 AM UTC

Thank you very much, this works. :)

Shyam G [Syncfusion]
Replied On February 6, 2020 03:44 AM UTC

Hi Manuel, 
Thanks for your update. 
Regards, 
Shyam G 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon