Introduction:
The AreaChart control enables you to render a area chart from one or more series
of values.
Sql Table:
create table PerformanceReport ( year int, AverageMarks int )
ASPX:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" 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>ajax AreaChart control</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:AreaChart ID="AreaChart1" runat="server" ChartWidth="400" ChartHeight="250"
ChartTitle="Student Performance Chart" ChartTitleColor="#0E426C" CategoryAxisLineColor="#D08AD9"
ValueAxisLineColor="#D08AD9" BaseLineColor="#A156AB" ChartType="Basic">
</asp:AreaChart>
</form>
</body>
</html>
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.SqlClient;
using System.Data;
namespace WebApplication5
{
public partial class WebForm2 : System.Web.UI.Page
{
SqlConnection _objcon = new SqlConnection("Data Source=gohil-809553B1F;uid=sa;pwd=sa123;Initial Catalog=DEMO;Integrated Security=True;");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindCharData();
}
}
//code to bind chart
protected void BindCharData()
{
string categoriesaxis = "";
DataTable dt = new DataTable();
string query = "SELECT * FROM PerformanceReport";
SqlDataAdapter _objda = new SqlDataAdapter(query, _objcon);
_objda.SelectCommand.CommandType = CommandType.Text;
_objcon.Open();
_objda.Fill(dt);
decimal[] data = new decimal[dt.Rows.Count];
for (int i = 0; i < dt.Rows.Count; i++)
{
categoriesaxis = categoriesaxis + "," + dt.Rows[i]["Year"].ToString();
data[i] = Convert.ToDecimal(dt.Rows[i]["AverageMarks"].ToString());
}
AreaChart1.CategoriesAxis = categoriesaxis.Remove(0, 1);
AreaChart1.Series.Add(new AjaxControlToolkit.AreaChartSeries { Data = data, AreaColor = "Red", Name = "Performance" });
_objcon.Close();
}
}
}
0 comments :
Post a Comment