ASP.Net Chart Object - Graph Creator

Home
Computer Programming

Computer Programming

Graph Creator developed by ASP.Net Chart Object

ASP.Net chart object is one of the most impressive element of the .Net Framework;it can easily be used to produce any graph that we use everyday in our lives. In this tutorial, ASP.Net chart object is used to produce a graph sketching application.

Graph Creator

Graph Creator uses AJAX in communicating with the server. That means, it will respond to your choice in a split-second, rather than keep you waiting for a full page refreshing. When you select the graph, you will see the amazing effect - and the pleasant user experience - when you play with various graphs in the programme.

Please choose a curve and then click the button.

Straight Line

Quadratic

Cubic

Reciprocal

The Exponential

Circle

Natural Log

Sine Curve

Cosine Curve

Tan Curve

The .aspx page for the above is as follows:

<asp:Chart ID="Chart1" Height="400px" Width="400px" runat="server" BorderlineColor="Beige" BorderSkin-BackColor="Beige" BackColor="lemonchiffon" CssClass="imgforcontent" ImageStorageMode="UseImageLocation" ImageLocation="~/aspchart/Sketch" ImageType="Png">

<Series>
<asp:Series Name="Series1">
</asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1">
</asp:ChartArea>
</ChartAreas>
<BorderSkin SkinStyle ="Emboss" />
</asp:Chart>
<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatColumns="1"
RepeatDirection="Vertical" Width="160px" BorderColor="AliceBlue"
BorderStyle="Solid" BorderWidth="5px" Font-Bold="True" Font-Size="small"
ForeColor="ButtonShadow" Height="100px">
<asp:ListItem>Straight Line</asp:ListItem>
<asp:ListItem>Quadratic</asp:ListItem>
<asp:ListItem>Cubic</asp:ListItem>
<asp:ListItem>Reciprocal</asp:ListItem>
<asp:ListItem>The Exponential</asp:ListItem>
<asp:ListItem>Circle</asp:ListItem>
<asp:ListItem>Natural Log</asp:ListItem>
<asp:ListItem>Sine Curve</asp:ListItem>
<asp:ListItem>Cosine Curve</asp:ListItem>
<asp:ListItem>Tan Curve</asp:ListItem>
</asp:RadioButtonList>
<br />
<asp:Button ID="btnBasicGraphs" runat="server" Text="Click to Sketch"
onclick="btnBasicGraphs_Click" />

The code for .aspx.cs is is as follows:

Series series = new Series("Spline");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
MultiView1.ActiveViewIndex = 0;
Sketch();
}
}
protected void btnBasicGraphs_Click(object sender, EventArgs e)
{
Chart1.Series.Clear();
Transform();
series.ChartType = SeriesChartType.Spline;
series.BorderWidth = 2;
series.ShadowOffset = 1;
Chart1.ChartAreas[0].BackColor = System.Drawing.Color.LemonChiffon;
Chart1.ChartAreas[0].AxisX.Minimum = -5;
Chart1.ChartAreas[0].AxisX.Maximum = 5;
switch (RadioButtonList1.SelectedIndex)
{
case 0:
DrwStLn();
break;
case 1:
DrwQdCrv();
break;
case 2:
DrwCbcCrv();
break;
case 3:
DrwRcpCrv();
break;
case 4:
DrwExpCrv();
break;
case 5:
DrwCrc();
break;
case 6:
DrwLgCrv();
break;
case 7:
DrwSnCrv();
break;
case 8:
DrwCsCrv();
break;
default:
DrwTnCrv();
break;
}
}
//for straight line
protected void DrwStLn()
{
Chart1.Series.Clear();
for (double i = -5; i <= 5; i += 1)
{
series.Points.AddXY(i, 2 * i - 3);
}
// Add series into the chart's series collection
Chart1.ChartAreas[0].AxisY.Minimum = -10;
Chart1.ChartAreas[0].AxisY.Maximum = 10;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 1;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//for quadratic curve
protected void DrwQdCrv()
{
Chart1.Series.Clear();
for (double i = -4; i <= 4; i += 1)
{
series.Points.AddXY(i, Math.Pow(i, 2));
}
// Add series into the chart's series collection
Chart1.ChartAreas[0].AxisY.Minimum = -10;
Chart1.ChartAreas[0].AxisY.Maximum = 10;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 4;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 4;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
//for a cubic graph
}
protected void DrwCbcCrv()
{
Chart1.Series.Clear();
for (double i = -3; i <= 3; i += 1)
{
series.Points.AddXY(i, Math.Pow(i, 3));
}
// Add series into the chart's series collection
Chart1.ChartAreas[0].AxisY.Minimum = -20;
Chart1.ChartAreas[0].AxisY.Maximum = 20;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 1;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//for reciprocral graph
protected void DrwRcpCrv()
{
Chart1.Series.Clear();
for (double i = -10; i <= 10; i++)
{
Chart1.ChartAreas[0].AxisY.Minimum = -1;
Chart1.ChartAreas[0].AxisY.Maximum = 1;
if (!(i == 0))
{
series.Points.AddXY(i, 1 / i);
}
}
// Add series into the chart's series collection
series.ChartType = SeriesChartType.FastPoint;
Chart1.ChartAreas[0].AxisX.Minimum = -10;
Chart1.ChartAreas[0].AxisX.Maximum = 10;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 1;
Chart1.ChartAreas[0].AxisY.Minimum = -2;
Chart1.ChartAreas[0].AxisY.Maximum = 2;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 0.2;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 0.2;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//for exponential function
protected void DrwExpCrv()
{
Chart1.Series.Clear();
for (double i = -6; i <= 6; i += 1)
{
series.Points.AddXY(i, Math.Exp(i));
}
// Add series into the chart's series collection
series.ChartType = SeriesChartType.Spline;
Chart1.ChartAreas[0].AxisX.Minimum = -6;
Chart1.ChartAreas[0].AxisX.Maximum = 6;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.Minimum = -10;
Chart1.ChartAreas[0].AxisY.Maximum = 10;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//for a circle
protected void DrwCrc()
{
Chart1.Series.Clear();
for (double i = 0; i <= 2 * Math.PI; i += 0.01)
{
series.Points.AddXY(4 * Math.Cos(i), 4 * Math.Sin(i));
//series.Points.AddXY(i, -Math.Sqrt(25 - i ^ 2))
}
// Add series into the chart's series collection
series.ChartType = SeriesChartType.FastPoint;
Chart1.ChartAreas[0].AxisX.Minimum = -6;
Chart1.ChartAreas[0].AxisX.Maximum = 6;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 1;
Chart1.ChartAreas[0].AxisY.Minimum = -6;
Chart1.ChartAreas[0].AxisY.Maximum = 6;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 1;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 1;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//natural log function
protected void DrwLgCrv()
{
Chart1.Series.Clear();
for (double i = 0; i <= 4; i += 0.01)
{
if (i > 0)
series.Points.AddXY(i, Math.Log(i));
//series.Points.AddXY(i, -Math.Sqrt(25 - i ^ 2))
}
// Add series into the chart's series collection
series.ChartType = SeriesChartType.Spline;
Chart1.ChartAreas[0].AxisX.Minimum = -6;
Chart1.ChartAreas[0].AxisX.Maximum = 6;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.Minimum = -10;
Chart1.ChartAreas[0].AxisY.Maximum = 10;
Chart1.ChartAreas[0].AxisY.MajorGrid.Interval = 2;
Chart1.ChartAreas[0].AxisY.MajorTickMark.Interval = 2;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
//for sine curve
protected void DrwSnCrv()
{
Chart1.Series.Clear();
for (double i = 0; i <= 360; i += 45)
{
series.Points.AddXY(i, Math.Sin(i * Math.PI / 180));
//series.Points.AddXY(i, -Math.Sqrt(25 - i ^ 2))
}
Chart1.ChartAreas[0].AxisY.Minimum = -2;
Chart1.ChartAreas[0].AxisY.Maximum = 2;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Maximum = 360;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 90;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 90;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
// Add series into the chart's series collection
Chart1.Series.Add(series);
}
//for cos curve
protected void DrwCsCrv()
{
Chart1.Series.Clear();
for (double i = 0; i <= 360; i += 45)
{
series.Points.AddXY(i, Math.Cos(i * Math.PI / 180));
//series.Points.AddXY(i, -Math.Sqrt(25 - i ^ 2))
}
Chart1.ChartAreas[0].AxisY.Minimum = -2;
Chart1.ChartAreas[0].AxisY.Maximum = 2;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Maximum = 360;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 90;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 90;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
// Add series into the chart's series collection
Chart1.Series.Add(series);
}
//for tan curve
protected void DrwTnCrv()
{
Chart1.Series.Clear();
for (double i = 0; i <= 360; i += 1)
{
if (!(i == 90) && !(i == 270))
{
series.Points.AddXY(i, Math.Tan(i * Math.PI / 180));
}
//series.Points.AddXY(i, -Math.Sqrt(25 - i ^ 2))
}
// Add series into the chart's series collection
series.ChartType = SeriesChartType.FastPoint;
Chart1.ChartAreas[0].AxisY.Minimum = -15;
Chart1.ChartAreas[0].AxisY.Maximum = 15;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Maximum = 360;
Chart1.ChartAreas[0].AxisX.MajorGrid.Interval = 90;
Chart1.ChartAreas[0].AxisX.MajorTickMark.Interval = 90;
Chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.Red;
Chart1.ChartAreas[0].AxisX.LineColor = System.Drawing.Color.Red;
Chart1.Series.Add(series);
}
// sketch a parabola as the default graph
protected void Sketch()
{
Chart1.Series.Clear();
Series series = new Series("Spline");
series.ChartType = SeriesChartType.Spline;
series.BorderWidth = 2;
series.ShadowOffset = 1;
Chart1.ChartAreas[0].BackColor = System.Drawing.Color.LemonChiffon;
Chart1.ChartAreas[0].AxisY.Minimum = -10;
Chart1.ChartAreas[0].AxisY.Maximum = 10;
Chart1.ChartAreas[0].AxisX.Minimum = -5;
Chart1.ChartAreas[0].AxisX.Maximum = 5;
//Populate new series with data
for (double i = -5; i <= 5; i++)
{
series.Points.AddXY(i, Math.Pow(i, 2));
}
//Add series into the chart's series collection
Chart1.Series.Add(series);
}