New to Telerik UI for ASP.NET AJAX? Download free 30-day trial


This help article describes which properties to use to bind a RadHtmlChart to an ObjectDataSource and presents a code example. You can bind a RadHtmlChart to an ObjectDataSource using the following properties:

  • DataSourceID in the main tag sets the declarative data source for the entire chart. You can use the DataSource property for a programmatic data source if you create the connection in the code-behind.

  • DataFieldY property (and ColorField, ExplodeField, NameField for Pie; DataFieldX for Scatter and ScatterLine, etc.) for the series to point it to the desired field from the data source.

  • DataLabelsField for the x-axis labels to populate the items for the axis.

Example 1: Bind an ObjectDataSource to a RadHtmlChart.

<telerik:RadHtmlChart runat="server" ID="RadHtmlChart3" Height="400px" Width="800px" DataSourceID="ObjectDataSource1">
            <telerik:ColumnSeries DataFieldY="AverageRating">
        <XAxis DataLabelsField="VehicleName">
            <TitleAppearance Text="Name">
                <TextStyle Margin="20" />
            <MajorGridLines Visible="false" />
            <MinorGridLines Visible="false" />
            <TitleAppearance Text="Average Rating">
                <TextStyle Margin="20" />
            <MinorGridLines Visible="false" />
    <ChartTitle Text="Vehicles Average Rating">
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="Vehicle"

The class Vehicle is declared in the directory App_Code of the website and exposes a method, GetVehicleRatings, which returns the data for the chart, as shown in Example 2.

Example 2: Create a class with a static method that returns a DataTable filled with data from a database.

public class Vehicle
    private static string connectionString = ConfigurationManager.ConnectionStrings["TelerikConnectionString"].ToString();

    public static DataTable GetVehicleRatings()
        SqlConnection connection = new SqlConnection(connectionString);
        SqlCommand command = new SqlCommand("SELECT TOP 10 [VehicleName], [AverageRating] FROM [Vehicles]", connection);
        SqlDataAdapter adapter = new SqlDataAdapter(command);
        DataSet ds = new DataSet("Vehicles");
        adapter.Fill(ds, "Vehicles");
        return ds.Tables["Vehicles"];

Public Class Vehicle
    Private Shared connectionString As String = ConfigurationManager.ConnectionStrings("TelerikConnectionString").ToString()

    Public Shared Function GetVehicleRatings() As DataTable
        Dim connection As New SqlConnection(connectionString)
        Dim command As New SqlCommand("SELECT TOP 10 [VehicleName], [AverageRating] FROM [Vehicles]", connection)
        Dim adapter As New SqlDataAdapter(command)
        Dim ds As New DataSet("Vehicles")
        adapter.Fill(ds, "Vehicles")
        Return ds.Tables("Vehicles")
    End Function
End Class

See Also

In this article
Not finding the help you need? Improve this article