New to Telerik UI for Blazor? Download Free 30-day trial
Gantt - Zooming
- EXAMPLE
- VIEW SOURCE
- EDIT IN TELERIK REPL
- Change Theme
default
| Task Title | Start | End | Status | Commands |
|---|
| Employee 1 | 12/15/2020 | 12/20/2020 | 12.500% | |
| Employee 1 : 0 | 12/15/2020 | 12/16/2020 | 0.000% | |
| Employee 1 : 1 | 12/16/2020 | 12/17/2020 | 22.500% | |
| Employee 1 : 2 | 12/17/2020 | 12/18/2020 | 45.000% | |
| Employee 1 : 3 | 12/18/2020 | 12/19/2020 | 67.500% | |
| Employee 1 : 4 | 12/19/2020 | 12/20/2020 | 90.000% | |
| Employee 2 | 12/16/2020 | 12/21/2020 | 25.000% | |
| Employee 2 : 0 | 12/16/2020 | 12/17/2020 | 0.000% | |
| Employee 2 : 1 | 12/17/2020 | 12/18/2020 | 22.500% | |
| Employee 2 : 2 | 12/18/2020 | 12/19/2020 | 45.000% | |
| Employee 2 : 3 | 12/19/2020 | 12/20/2020 | 67.500% | |
| Employee 2 : 4 | 12/20/2020 | 12/21/2020 | 90.000% | |
| Employee 3 | 12/17/2020 | 12/22/2020 | 37.500% | |
| Employee 3 : 0 | 12/17/2020 | 12/18/2020 | 0.000% | |
| Employee 3 : 1 | 12/18/2020 | 12/19/2020 | 22.500% | |
| Employee 3 : 2 | 12/19/2020 | 12/20/2020 | 45.000% | |
| Employee 3 : 3 | 12/20/2020 | 12/21/2020 | 67.500% | |
| Employee 3 : 4 | 12/21/2020 | 12/22/2020 | 90.000% | |
| Employee 4 | 12/18/2020 | 12/23/2020 | 50.000% | |
| Employee 4 : 0 | 12/18/2020 | 12/19/2020 | 0.000% | |
| Employee 4 : 1 | 12/19/2020 | 12/20/2020 | 22.500% | |
| Employee 4 : 2 | 12/20/2020 | 12/21/2020 | 45.000% | |
| Employee 4 : 3 | 12/21/2020 | 12/22/2020 | 67.500% | |
| Employee 4 : 4 | 12/22/2020 | 12/23/2020 | 90.000% | |
| Employee 5 | 12/19/2020 | 12/24/2020 | 62.500% | |
| Employee 5 : 0 | 12/19/2020 | 12/20/2020 | 0.000% | |
| Employee 5 : 1 | 12/20/2020 | 12/21/2020 | 22.500% | |
| Employee 5 : 2 | 12/21/2020 | 12/22/2020 | 45.000% | |
| Employee 5 : 3 | 12/22/2020 | 12/23/2020 | 67.500% | |
| Employee 5 : 4 | 12/23/2020 | 12/24/2020 | 90.000% |
| Tue 12/15 | Wed 12/16 | Thu 12/17 | Fri 12/18 | Sat 12/19 | Sun 12/20 | Mon 12/21 | Tue 12/22 | Wed 12/23 | Thu 12/24 | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM | 00:00 AM | 01:00 AM | 02:00 AM | 03:00 AM | 04:00 AM | 05:00 AM | 06:00 AM | 07:00 AM | 08:00 AM | 09:00 AM | 10:00 AM | 11:00 AM | 12:00 PM | 13:00 PM | 14:00 PM | 15:00 PM | 16:00 PM | 17:00 PM | 18:00 PM | 19:00 PM | 20:00 PM | 21:00 PM | 22:00 PM | 23:00 PM |
- Zooming.razor
Loading the demo source code...please wait.
Description
The Gantt has Zoom To Fit functionality. This online demo show a Gantt with two custom command buttons that trim the range of Timeline based on the minor slot division of the view.
This Blazor Gantt Zooming example is part of a unique collection of hundreds of Blazor demos, with which you can see all Telerik UI for Blazor components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for Blazor or ThemeBuilder.