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

Horizontal scroll is not working on mouse scroll

Thread ID:

Created:

Updated:

Platform:

Replies:

147330 Sep 6,2019 07:51 AM UTC Dec 31,2019 10:57 AM UTC React - EJ 2 11
loading
Tags: Diagram
Sudhanshu Jain
Asked On September 6, 2019 07:51 AM UTC

Hi ,
Below is the issue and expected output,

Issue: When the nodes/connectors exceed the view width and there is a need to scroll the page horizontally , we see that the page is vertically scrolled and not able to view the rest of the workflows.

Expected output : When we scroll horizontally , the page should scroll to the right swiftly and update the view ( the nodes/connectors which were hidden has to be displayed).

Please let me know if there is any solution to achieve the expected output.
Thanks

Shyam G [Syncfusion]
Replied On September 9, 2019 06:19 AM UTC

Hi Sudhanshu Jain, 

By Default, when the diagram nodes and connectors exceeds the diagram view width and height, the horizontal and vertical diagram scrollbar appears.  You can scroll vertically using mousescroll and horizontally scroll using shift+mousescroll. Before looking into your requirement, could you please confirm us whether a horizontal scrollbar doesn’t appears or could not able to move the horizontal scrollbar? Please share us more details such as a screenshot or video to demonstrate an issue at our end.  


Regards, 
Shyam G 


Sudhanshu Jain
Replied On September 11, 2019 07:41 AM UTC

Hi Shyam,

We were trying to scroll right using mouse-scroll for horizontal scroll instead of shift+scroll, is there a way to scroll horizontally apart from shift+scroll or can that functionality be changed?

Thanks

Shyam G [Syncfusion]
Replied On September 12, 2019 04:36 AM UTC

Hi Sudhanshu Jain, 
 
The options available to move the horizontal scrollbar dynamically are given below. 
 
  1. We can pan the diagram to view entire diagram that automatically updates the scrollbar. Please refer to a below sample
  2. Use scrollSettings horizontalOffset value to change the horizontal scrollbar by clicking on the button. Please refer to a code example and sample below
 
Code example: 
updatescrolloffset() { 
      //change the scrollbar offset value dynamically 
      diagramInstance.scrollSettings.horizontalOffset = 1000;  
    } 
 
You can finally use shift + scroll to dynamically move the horizontal scrollbar. 
 
 
Regards, 
Shyam G 


Sudhanshu Jain
Replied On September 12, 2019 09:25 AM UTC

Thanks Shyam for providing the details.

Shyam G [Syncfusion]
Replied On September 12, 2019 12:04 PM UTC

Hi Sudhanshu Jain, 
Thanks for your update. 
Regards, 
Shyam G 


Sudhanshu Jain
Replied On November 5, 2019 03:12 PM UTC

Hi Shyam,

Horizontal scroll is not swift enough even with shift + mouse scroll.

Is there any other property to be set along in Diagram component?

Regards,
Sudhanshu

Shyam G [Syncfusion]
Replied On November 6, 2019 12:51 PM UTC

Hi Sudhanshu, 
 
We could not able to replicate an issue at our end. Could you please check in the below sample?. Still if you face issues, please share us more details such as video to demonstrate an issue. 
 
 
Regards, 
Shyam G 


Sudhanshu Jain
Replied On November 7, 2019 05:48 AM UTC

Hi Shyam,

In the sample demo which you have provided , i observed that with shift + scroll there is a lag in scroll, i.e. the scroll happens the opposite direction a bit and then in forward direction.

Regards,
Sudhanshu

Shyam G [Syncfusion]
Replied On November 8, 2019 04:21 AM UTC

Hi Sudhanshu, 
 
Please look at a demo below where we used shift+mousewheel to scroll the diagram. We couldn't find a scrolling delay. Could you please share us more details such as browser version, OS and video to demonstrate an issue. 
 
 
 
Regards, 
Shyam G 


Sudhanshu Jain
Replied On December 27, 2019 06:42 AM UTC

Hi Shyam, 

We had discussed regarding this issue over call, we had concluded that this issue is happening for MAC and you would get back with a solution, could you please provide an update regarding the same.

Thanks

Shyam G [Syncfusion]
Replied On December 31, 2019 10:57 AM UTC

Hi Sudhanshu, 
 
We have checked the below sample in stackblitz and the scrolling works fine without lag in MAC machine. Could you please check in the below sample? Still, if you face any issues, please share us more details such as video to demonstrate an issue with the below sample. 
 
 
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