Top Ad unit 728 × 90

New Articles

random

How to create ASP.Net Chart Control from C# DataTable


MS Chart Control - Databind Pie Chart from Datatable

In this tutorial you will learn how to use the new MS Chart to render a Column Chart and Pie Chart from a DataTable source in C#. I will explain in brief about how to use the ASP.NET MS chart controls. 
chart control in asp.net 4.0 example, asp.net chart control tutorial, asp.net chart control samples, asp.net charts and graphs,
asp.net chart control tutorial
Related Articles
First make sure that you have installed Microsoft Chart Controls for Microsoft .NET or download and install on your machine. Find the below features of Microsoft Chart Controls in asp.net :-

  • All supported chart types.
  • Data series, chart areas, axes, legends, labels, titles, and more.
  • Data Binding
  • Data manipulation, such as copying, splitting, merging, alignment, grouping, sorting, searching, filtering, and more.
  • Statistical formulas and financial formulas.
  • Advanced chart appearance, such as 3D, anti-aliasing, lighting, perspective, and more.
  • Chart rendering.
  • Events and Customization.
  • Interactivity and AJAX. 
MS Chart control - Databind pie chart from Datatable in ASP .Net
asp.net charts and graphs
In the following asp.net chart control example you will learn how to create different types of charts in asp.net web application. Find the C# code below :- 
Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Chart ID="Chart1" runat="server" Height="296px" Width="412px" BorderDashStyle="Solid"
            BackSecondaryColor="White" BackGradientStyle="TopBottom" BorderWidth="2px" BackColor="211, 223, 240"
            BorderColor="#1A3B69">
            <Titles>
                <asp:Title Text="Title of the Graph comes here" />
            </Titles>
            <Series>
                <asp:Series Name="Series1" BorderColor="180, 26, 59, 105">
                </asp:Series>
            </Series>
            <ChartAreas>
                <asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid"
                    BackSecondaryColor="White" BackColor="64, 165, 191, 228" ShadowColor="Transparent"
                    BackGradientStyle="TopBottom">
                    <Area3DStyle Rotation="10" Perspective="10" Inclination="15" IsRightAngleAxes="False"
                        WallWidth="0" IsClustered="False"></Area3DStyle>
                    <AxisY LineColor="64, 64, 64, 64">
                        <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                        <MajorGrid LineColor="64, 64, 64, 64" />
                    </AxisY>
                    <AxisX LineColor="64, 64, 64, 64">
                        <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                        <MajorGrid LineColor="64, 64, 64, 64" />
                    </AxisX>
                </asp:ChartArea>
            </ChartAreas>
        </asp:Chart>
    </div>
    </form>
</body>
</html>
Bind datatable to Chart control : charts and graphs,chart for .net,asp charts
asp.net chart control example c#
Default.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Web.UI.DataVisualization.Charting;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Chart1.Series["Series1"].ChartType = SeriesChartType.Column;
        Chart1.Series["Series1"]["DrawingStyle"] = "Emboss";

        Chart1.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true;
        Chart1.Series["Series1"].IsValueShownAsLabel = true;
       
        DataTable dt = new DataTable();      
        dt.Columns.Add("Id", typeof(int));
        dt.Columns.Add("Name", typeof(string));
        dt.Columns.Add("Age", typeof(string));
        dt.Columns.Add("Date", typeof(DateTime));

        //
        // Here we add five DataRows.
        //
        dt.Rows.Add(25, "Rk", "26", DateTime.Now);
        dt.Rows.Add(50, "Sachin", "24", DateTime.Now);
        dt.Rows.Add(10, "Nitin", "22", DateTime.Now);
        dt.Rows.Add(21, "Aditya", "18", DateTime.Now);
        dt.Rows.Add(100, "Mohan", "29", DateTime.Now);

        Chart1.DataSource = dt;
        Chart1.Series["Series1"].XValueMember = "Name";
        Chart1.Series["Series1"].YValueMembers = "Age";
        Chart1.DataBind();
    }
}

I hope you will enjoy the development tip while creating asp.net charts and graphs using c# datatable. I would like to have feedback from my blog readers. Your valuable feedback, question, or comments about this article are always welcome. 

Also If you like this article, don't forget to share this article with your friends and colleagues.
How to create ASP.Net Chart Control from C# DataTable Reviewed by Ravi Kumar on 6:16 PM Rating: 5

No comments:

All Rights Reserved by Etech Pulse - "Coding Is Today's Language Of Creativity" © 2014 - 2015
Powered By Blogger

Contact Form

Name

Email *

Message *

Powered by Blogger.