13,195,026 members (97,765 online)
alternative version

#### Stats

21.8K views
19 bookmarked
Posted 17 Mar 2011

# Bezier curve for the Microsoft Web Chart control

, 17 Mar 2011
 Rate this:
Adds a new series that can be used in the MS Web Chart control which will draw a Bezier curve for the construction points you define.

## Introduction

This is an add-on for the Microsoft Web Chart control. It is a new series type that draws a Bezier curve according to the points you pass.

## Using the code

I recently needed a Bezier graph in a web app. The Microsoft Web Chart control (which is actually the Dundas chart control) is a powerful control, so I added the functionality I needed to it. For the calculation of the Bezier curve itself, I used code from a CodeProject article by Tolga Birdal, you can find his work here. I encapsulated his code in a class called `CalcBezierCurve`. Then I created a new class `BezierSeries` which inherits from `System.Web.UI.DataVisualization.Charting.Series`. So you can use it in any chart from the Web Chart control.

```/// <span class="code-SummaryComment"><summary>
</span>/// You can use this Series like any other series in the MS web charting control
/// <span class="code-SummaryComment"></summary>
</span>public class BezierSeries : Series
{
#region fields

private int _pointsOnCurve = 1000;
private List<DataPoint> _bezierPoints = new List<DataPoint>();

#endregion

#region properties

/// <span class="code-SummaryComment"><summary>
</span>    /// Defines how many points the resulting curve will have;
/// min = 2, must eb an even number
/// <span class="code-SummaryComment"></summary>
</span>    public int PointsOnCurve
{
get { return _pointsOnCurve; }
set
{
//min value is 2
if (value < 2)
{
value = 2;
}

//it must be an even number
if (value % 2 == 1)
{
value++;
}

_pointsOnCurve = value;
}
}

/// <span class="code-SummaryComment"><summary>
</span>    /// Points that should be used to calculate the bezier graph
/// <span class="code-SummaryComment"></summary>
</span>    public List<DataPoint> BezierPoints
{
get
{
return _bezierPoints;
}
set
{
if (value != null)
{
_bezierPoints = value;

List<double> ptList = new List<double>();

//convert bezier points to flat list
foreach (DataPoint point in value)
{
}

//bezier curve calculation
CalcBezierCurve bc = new CalcBezierCurve();
double[] ptind = new double[ptList.Count];
double[] p = new double[PointsOnCurve];
ptList.CopyTo(ptind, 0);
bc.Bezier2D(ptind, (PointsOnCurve) / 2, p);

//bezier curve points
this.ChartType = SeriesChartType.Line;

for (int i = 0; i < p.Count(); i = i + 2)
{
this.Points.AddXY(p[i], p[i + 1]);
}
}
}
}

#endregion
}```

The usage is quite simple (I assume you have a web form with a chart control called `Chart1` on it):

```protected void Page_Load(object sender, EventArgs e)
{
//points to calculate the bezier graph
List<DataPoint> bezierPoints = new List<DataPoint>();

//chart control setup
Chart1.Series.Clear();
Chart1.ChartAreas.Clear();

//bezier points chart
ChartArea bezierPointsArea = new ChartArea("BezierPointsArea");
Series bezierPointSeries = new Series("BezierPoints");
bezierPointSeries.ChartType = SeriesChartType.Point;

foreach (DataPoint bezierPoint in bezierPoints)
{
}

//bezier curve chart
ChartArea bezierCurveArea = new ChartArea("BezierCurveArea");
//create instance of our bezier series
BezierSeries bezierSeries = new BezierSeries();
bezierSeries.Name = "BezierCurve";
//set number of points, default is 1000
bezierSeries.PointsOnCurve = 100;
//set points which should be used to calc the bezier graph
bezierSeries.BezierPoints = bezierPoints;
}```

And this is the result:

## History

• 2011-03-17 V 1.0: Initial version.

## About the Author

 Software Developer (Senior) Austria
Born and living in Vienna, Austria. Started with Pascal in 1993 and MS-DOS 5.0. After that a little C++ in OS/2 and loads of VBA with Access in Windows 95,98, NT. To get more professionel I started C# in 2002 and did some MCP exams on that. After working for my own company I got hired by different companies. Currently I'm employed at the Federal Chambers of Commerce as a Senior Software Engineer.

 Pro

## Comments and Discussions

 View All Threads First Prev Next
 Some problems dherrmann22-Mar-11 22:01 dherrmann 22-Mar-11 22:01
 Re: Some problems [modified] Rainer Halanek22-Mar-11 22:41 Rainer Halanek 22-Mar-11 22:41
 Re: Some problems dherrmann23-Mar-11 0:18 dherrmann 23-Mar-11 0:18
 Re: Some problems Rainer Halanek23-Mar-11 0:29 Rainer Halanek 23-Mar-11 0:29
 Last Visit: 31-Dec-99 18:00     Last Update: 19-Oct-17 8:48 Refresh 1

General    News    Suggestion    Question    Bug    Answer    Joke    Praise    Rant    Admin

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.