jquery.flowchart icon indicating copy to clipboard operation
jquery.flowchart copied to clipboard

Redraw Links on Canvas Scroll

Open Rob-ModernAnalytics opened this issue 6 years ago • 8 comments

Hi,

I added scrolling to my canvas and everything works fine except the links don't redraw. I thought that by adding scroll event to my canvas and running your redrawLinksLayer function that this would work. The links are redrawn but not in the correct positions relative to the operators.

Is there a way to get this to work?

Thanks,

Rob

Rob-ModernAnalytics avatar May 12 '18 01:05 Rob-ModernAnalytics

Hi,

I don't understand. Are you talking about the zoom feature (that uses the scroll button)? Or did you simply add the ability to scroll from up to bottom and / or left to right ? In that case, where did you add the scroll properties?

Thanks,

sdrdis avatar May 12 '18 09:05 sdrdis

Hi,

Thanks for the quick response. My apologies for not clarifying. I am not using the zoom feature. In my css I overrode the overflow setting in your .flowchart-container class:

.flowchart-container { overflow: auto; }

Hope this helps!

Thanks again,

Rob

Rob-ModernAnalytics avatar May 12 '18 16:05 Rob-ModernAnalytics

Hmm, it is going to be difficult if you go down that road. Instead, check http://sebastien.drouyer.com/jquery.flowchart-demo/#advanced

You can add scrolls easily if you want...

sdrdis avatar May 12 '18 16:05 sdrdis

I'll keep experimenting. An interesting observation is that when the window is resized by dragging the window edges everything re-paints just fine. I was trying to force that behavior when the scrollbar moved.

I've been a bit hesitant to use the pan and zoom approach because I'm building an option to drag-select multiple operators (lasso) so they can be moved together and that would interfere with the panning. Also if you pan the container too far the areas to right/left/top/bottom become a gray hash, which isn't too pleasant.

Again thanks for your quick response. I'll let you know if I come up with anything that works for me!

Rob

Rob-ModernAnalytics avatar May 12 '18 16:05 Rob-ModernAnalytics

Hi,

I finally had time to work on allowing the canvas to scroll properly. I just had to add a few scrolling tweaks to let the flowchart know about x and y scroll positions and adjust the math accordingly. Everything works great with no loss of functionality. Overall probably 15 lines of code were added.

Now off to work on the lasso capability mentioned in my last post.

Thanks for a great tool!

Rob

Rob-ModernAnalytics avatar May 01 '20 21:05 Rob-ModernAnalytics

@Rob-ModernAnalytics any chance that you can share these changes with us? We are experiencing a similar problem with our implementation and would love to see a potential fix (the lines are not connecting well when we are scrolling the canvas).

suexID avatar Sep 05 '20 10:09 suexID

Hi,

I would be happy to share the code – what is the best way to do this?

Thanks,

Rob

From: suexID [email protected] Sent: Saturday, September 5, 2020 3:06 AM To: sdrdis/jquery.flowchart [email protected] Cc: Rob Thibault [email protected]; Mention [email protected] Subject: Re: [sdrdis/jquery.flowchart] Redraw Links on Canvas Scroll (#81)

@Rob-ModernAnalyticshttps://github.com/Rob-ModernAnalytics any chance that you can share these changes with us? We are experiencing a similar problem with our implementation and would love to see a potential fix (the lines are not connecting well when we are scrolling the canvas).

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/sdrdis/jquery.flowchart/issues/81#issuecomment-687583475, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AGIDUAIC4CGWMA46UYBHP43SEIEO5ANCNFSM4E7Q6BIQ.

Rob-ModernAnalytics avatar Sep 05 '20 15:09 Rob-ModernAnalytics

@Rob-ModernAnalytics Would you be able to share it in a gist and link it in here? (sorry for getting back to you late)

suexID avatar Oct 15 '20 12:10 suexID