In this article I will explain with an example how to dynamically populate ASP.Net AJAX Control Toolkit Animated Pie Chart control from SQL Server Database.
ASP.Net AJAX Control Toolkit Pie Chart Example to populate from database
 
 
Database
Here I am making use of Microsoft’s Northwind Database. You can download it from here
Download and install Northwind Database
 
Using the ASP.Net AJAX Pie Chart control
1. Drag an ASP.Net AJAX ToolScriptManager on the page.
2. Register the AJAX Control Toolkit Library after adding reference to your project
 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
 
 
HTML Markup
The HTML Markup is simple, it contains of an ASP.Net DropDownList and ASP.Net AJAX Control Toolkit Pie Chart control.
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
<asp:DropDownList ID="ddlCountries" runat="server" OnSelectedIndexChanged="ddlCountries_SelectedIndexChanged"
    AutoPostBack="true">
</asp:DropDownList>
<hr />
<cc1:PieChart ID="PieChart1" runat="server" ChartHeight="300" ChartWidth = "300"
    ChartType="Column" ChartTitleColor="#0E426C" Visible = "false">
</cc1:PieChart>
 
Based on the selection of the DropDownList the Pie Chart will be dynamically populated from database.
 
 
Namespaces
You will need to import the following Namespaces
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
 
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
 
 
Populating the DropDownList and the ASP.Net AJAX Control Toolkit Pie Chart
In the Page Load event of the ASP.Net Page I have populated the DropDownList with list of Countries from the Northwind database where the Orders have been shipped.
Then on the SelectedIndexChanged event of the DropDownList I have populated the statistical information i.e. in which City of that selected country the Orders have been distributed.
This statistical information is presented as Pie Chart where Axis are the Cities of the Countries of the selected City and the series are the total amount of Orders shipped in each city.
C#
 
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        string query = "select distinct shipcountry from orders";
        DataTable dt = GetData(query);
        ddlCountries.DataSource = dt;
        ddlCountries.DataTextField = "shipcountry";
        ddlCountries.DataValueField = "shipcountry";
        ddlCountries.DataBind();
        ddlCountries.Items.Insert(0, new ListItem("Select", ""));
    }
}
protected void ddlCountries_SelectedIndexChanged(object sender, EventArgs e)
{
    string query = string.Format("select ShipCity, count(orderid) TotalOrders from orders where shipcountry = '{0}' group by shipcity", ddlCountries.SelectedItem.Value);
    DataTable dt = GetData(query);
 
    //Loop and add each datatable row to the Pie Chart Values
    foreach (DataRow row in dt.Rows)
    {
        PieChart1.PieChartValues.Add(new AjaxControlToolkit.PieChartValue
        {
            Category = row["ShipCity"].ToString(),
            Data = Convert.ToDecimal(row["TotalOrders"])
        });
    }
    PieChart1.Visible = ddlCountries.SelectedItem.Value != "";
}
 
private static DataTable GetData(string query)
{
    DataTable dt = new DataTable();
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand(query))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.CommandType = CommandType.Text;
                cmd.Connection = con;
                sda.SelectCommand = cmd;
                sda.Fill(dt);
            }
        }
        return dt;
    }
}
 
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    If Not IsPostBack Then
        Dim query As String = "select distinct shipcountry from orders"
        Dim dt As DataTable = GetData(query)
        ddlCountries.DataSource = dt
        ddlCountries.DataTextField = "shipcountry"
        ddlCountries.DataValueField = "shipcountry"
        ddlCountries.DataBind()
        ddlCountries.Items.Insert(0, New ListItem("Select", ""))
    End If
End Sub
Protected Sub ddlCountries_SelectedIndexChanged(sender As Object, e As EventArgs)
    Dim query As String = String.Format("select ShipCity, count(orderid) TotalOrders from orders where shipcountry = '{0}' group by shipcity", ddlCountries.SelectedItem.Value)
    Dim dt As DataTable = GetData(query)
 
    'Loop and add each datatable row to the Pie Chart Values
    For Each row As DataRow In dt.Rows
        PieChart1.PieChartValues.Add(New AjaxControlToolkit.PieChartValue() With { _
         .Category = row("ShipCity").ToString(), _
         .Data = Convert.ToDecimal(row("TotalOrders")) _
        })
    Next
    PieChart1.Visible = ddlCountries.SelectedItem.Value <> ""
End Sub
 
 
Private Shared Function GetData(query As String) As DataTable
    Dim dt As New DataTable()
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using con As New SqlConnection(constr)
        Using cmd As New SqlCommand(query)
            Usingspan> sda As New SqlDataAdapter()
                cmd.CommandType = CommandType.Text
                cmd.Connection = con
                sda.SelectCommand = cmd
                sda.Fill(dt)
            End Using
        End Using
        Return dt
    End Using
End Function
 
 
 
Demo
View Demo
 
 
Downloads