New to Kendo UI for jQuery? Download free 30-day trial
jQuery Bar Charts Pan and Zoom
- EXAMPLE
- VIEW SOURCE
-
Change Theme
blueopalDefault Theme
- Main
- Main Dark
- Nordic
- Ocean Blue
- Ocean Blue A11Y
- Purple
- Turquoise
Bootstrap Theme- Main
- Bootstrap 3
- Bootstrap 3 Dark
- Main Dark
- Nordic
- Turquoise
- Turquoise Dark
- Urban
- Vintage
Material Theme- Main
- Arctic
- Lime Dark
- Main Dark
- Material 2
- Material 2 Dark
- Nova
Classic Theme- Main
- Green
- Green Dark
- Lavender
- Lavender Dark
- Main Dark
- Metro
- Metro Dark
- Moonlight
- Opal
- Opal Dark
- Silver
- Silver Dark
- Uniform
Fluent Theme- Main
Also available for:
API REFERENCEDescription
The pan-and-zoom feature allow you to navigate through, and zoom in and zoom out the jQuery Bar Chart. You can enable the pan feature through the pannable property as well as to lock either the X or Y axis by using the nested pannable.lock one, or control the zoom ratio by using the zoomable.mousewheel.rate property.
To enable the zoom, set the zoomable configuration option. You can also fine-tune the mouse wheel and selection zooming through the available mousewheel and selection nested properties.
To zoom in data for a specific period of time on mouse-enabled devices, use the Shift + Mouse Drag Region Selection combination. To zoom in and out, use the mousewheel.
This Bar Chart example is part of a unique collection of hundreds of jQuery demos, with which you can see all Kendo UI for jQuery 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 Kendo UI for jQuery Dojo or ThemeBuilder.