New to Kendo UI for jQuery? Download free 30-day trial

jQuery Bar Charts Column Chart

Loading Demo...
  • EXAMPLE
  • VIEW SOURCE
  • Edit in Kendo UI Dojo
  • Change Theme
    default
    Default Theme
    • Main
    • Main Dark
    • Nordic
    • Ocean Blue
    • Ocean Blue A11Y accessibility
    • 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
    Launch Theme Builder
column.html

Also available for:

API REFERENCE

Description

The jQuery Column Chart visualizes data as vertical bars whose heights vary according to their value. It can be useful for presenting a comparison between several sets of data (for example, snapshots of data across different points in time like the GDP growth shown in this example). The Column Chart is very similar to the Bar Chart, with the only difference that bars orientation is vertical instead of horizontal.

The current example illustrates the basic usage of jQuery Bar Chart which enables the user to show customized bar charts.You can define the Chart series as horizontal with the seriesDefaults.type property set to "column".

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.

Support & Learning Resources

Additional Resources