Imagine you need to assign a task to a certain day, and then to a certain hour or even minute. So moving the node interactively with the mouse to the exact "time position" can become rather tricky. Read in this Gantt chart tricks post how to provide the planner with a function to combine rough and fine-tuned interactions. Applying this trick, will allow you to move the node quickly to the scheduled day, with a "rough" interaction mode and then move to a much more granular approach to achieve the fine-tuning of the node's position.
The trick is based on a combination of the functions mouse movement and arrow key movement.
In our .NET Gantt component VARCHART XGantt the arrow key is usually reserved for navigation, e.g. to scroll the diagram, or for inplace editing in the table. But this navigation function can be modified so the user can move, enlarge or reduce the size of a node.
Arrow key provides higher time resolution
Using the modified arrow key in combination with an information window enables the planner to work with a much higher resolution than offered by the timescale. In VARCHART XGantt you can even use three different modes to change the position of the node in one Gantt chart:
- by mouse (drag & drop)
- by arrow key plus Ctrl (the Ctrl activates an additional multiplier for the step size)
- by arrow key
The differences especially between the "rough" and the "fine-tune" mode can be seen from the below short video:
Jump between time spans
Vice versa you can also imagine a scenario where you need to move quickly between different time spans and you want to avoid extensive scrolling. Then an arrow key with a very high step size can help the planner to shift from one time span to the other.
How to implement with VARCHART XGantt:
To define this arrow key functionality in VARCHART XGantt, you need to take two simple steps:
- Change the standard arrow key function from navigating to moving in the property ArrowKeyMode from vcStandard to vcResizeOrMoveNode.
- Define the step size for the arrow key by the function ArrowKeyStepSizeMultiplier: this function multiplies the step size that is defined for the mouse with an additional factor.
With this tip, we focused on improving the interaction experience by allowing a "rough" and a "fine-tuned" movement of nodes. However, especially if you have loads of data this might not be sufficient. In that case, we recommend combining this trick with the idea of switching between granular and high-level views in your Gantt chart.
Got the idea? Then test by yourself and download your free trial version of VARCHART XGantt today:
