[Solved] Graph Editor/Timeline Zooming Methods
null
Hi,
I am working on an interface similar to graph editors, timelines or similar windows for displaying animation keyframes and curves such as those in many 3D DCC packages and engines. Just to be clear this is a 2D window, not a 3D viewport. My aim is to recreate a behavior where you hold a mouse button and drag left/right and it will zoom in/out based on the mouse position in the window.
Does anyone have any information, papers, articles, etc on zooming methods?
Thanks.
Edit: I've been scratching my head since last week and now I'm very happy that I've got a solution, so here it is
Get a percentage (0.0 -> 1.0) of the zoomed area, then get the left/right sides, subtract from the width, then multiply by the current zoom level and finally add to the initial position recorded when the button is pressed. mx_prev is position registered when mouse pressed.
x1 is left side of window (0)
x2 is right side, which is equal to the width specified
mx_zoom_pos is mouse position between zoomed x1,x2 as a percentage.
mx_zoom_a = 0.0 + mx_zoom_pos
x1_zoom = mx_prev - ((x2 * mx_zoom_a) * mx_zoom)
x2_zoom = mx_prev + ((x2 * mx_zoom_b) * mx_zoom) Here is a screen capture: https://gfycat.com/BackFaintAntelopegroundsquirrel
I am working on an interface similar to graph editors, timelines or similar windows for displaying animation keyframes and curves such as those in many 3D DCC packages and engines. Just to be clear this is a 2D window, not a 3D viewport. My aim is to recreate a behavior where you hold a mouse button and drag left/right and it will zoom in/out based on the mouse position in the window.
Does anyone have any information, papers, articles, etc on zooming methods?
Thanks.
Edit: I've been scratching my head since last week and now I'm very happy that I've got a solution, so here it is
Get a percentage (0.0 -> 1.0) of the zoomed area, then get the left/right sides, subtract from the width, then multiply by the current zoom level and finally add to the initial position recorded when the button is pressed. mx_prev is position registered when mouse pressed.
x1 is left side of window (0)
x2 is right side, which is equal to the width specified
mx_zoom_pos is mouse position between zoomed x1,x2 as a percentage.
mx_zoom_a = 0.0 + mx_zoom_pos
mx_zoom_b = 1.0 - mx_zoom_pos
x2_zoom = mx_prev + ((x2 * mx_zoom_b) * mx_zoom) Here is a screen capture: https://gfycat.com/BackFaintAntelopegroundsquirrel