Your search did not match any results.
Bar Charts

Standard Bar

Documentation

This demo shows the standard bar series type that visualizes data as a collection of bars. Follow the steps below to create and configure the Bar chart:

Bind to Data

You can bind the Bar chart to one of the following data sources:

In this demo, the Bar chart is populated with data taken from a simple JavaScript array.

Configure Series

Assign one or several series to the series property and specify the following settings:

  • The series type

  • Data source fields. Assign an appropriate field name to the argumentField and valueField properties if you want to bind a series to data directly. Alternatively, you can use a series template to bind series to data if a data source field contains names for series.

  • Optional. The barWidth property to specify individual series' bar width. See the Specify the Bar Width article for more information.

You can also use the commonSeriesSettings object to configure all series in the Bar chart.

Customize Bar Chart

You can show point labels to make the Bar chart more informative.

To help a user identify a series among others on the chart legend, specify its name.

If you want to change the default series color, use the color property.

Thank you for your interest in our ASP.NET MVC product libraries and UI component suite. We are moving ASP.NET MVC-related demos and content to DevExpress.com. Please make sure to update your bookmarks with our new URL.

View Demo