Microsoft Chart Controls for ASP.NET

Recently Microsoft has released .NET 3.5 Chart Control. The control is very rich in features supports a rich assortment of chart options - including pie, area, range, point, circular, accumulation, data distribution, Ajax interactive, doughnut, and more. They have the ability data bind to any object that implements IEnumerable (arrays, hashes, data tables, etc.).

I find the Chart control to be a great companion into my solutions where it requires some data presentation in terms of charts.

To use the Library (Note: Requires .NET 3.5 framework):
• Download and install Microsoft Chart Controls for Microsoft .NET Framework 3.5;
• Download Microsoft Chart Controls Add-on for Microsoft Visual Studio 2008;
• If you want to extend/use MS Chart Control grab the document and samples.

Here is an example:

Chart contains information about certain types of contracts and terms of validity of these contracts. Information is structured in years. Red line is today date. Also is added the ability to click on the number of contract and redirect to contract details page.
Asp page:

            
                                    ChartType="RangeBar" CustomProperties="BarLabelStyle=Outside, PointWidth=0.6"
                    IsVisibleInLegend="False" Color="#4282B5">
                
            
            
                
                    
                        
                        
                        
                        
                    
                    
                        
                        
                        
                    
                    
                        
                    
                    
                        
                    
                
            
        

Code behind page:

protected void Page_Load(object sender, EventArgs e)
{
     DesignChart();
}

protected void DesignChart()
  {
   BindContracts();
   if(Contracts.Count == 0) return;
   //Get min and max date for Y and Y2 axes
   DateTime minDate = Contracts[0].Start.HasValue ? Contracts[0].Start.Value : new DateTime();
   DateTime maxDate = Contracts[0].End.HasValue ? Contracts[0].End.Value : new DateTime();
   for (int index = 0; index < Contracts.Count; index++)
   {
    //Set value
    ChartContracts.Series["Serie"].Points.Add(Contracts[index].Start.Value.ToOADate(), Contracts[index].End.Value.ToOADate());
    //Get min and max date for Y and Y2 axes
    if (Contracts[index].Start.HasValue && Contracts[index].Start.Value < minDate) minDate = Contracts[index].Start.Value;
    if (Contracts[index].End.HasValue && Contracts[index].End.Value > maxDate) maxDate = Contracts[index].End.Value;
    //Draw additional LightGray lines on X axe
    for (double i = -0.3; i <= 0.3; i += 0.01)
    {
     ChartContracts.ChartAreas["Contract"].AxisX.CustomLabels.Add(index + 1 + i, index + 1 + i, string.Empty).GridTicks = GridTickTypes.Gridline;
    }
    //Set X axe Contract label
    var customLabel = new CustomLabel();
    customLabel.Text = Contracts[index].Code;
    customLabel.PostBackValue = customLabel.Name = Contracts[index].Id.ToString();
    customLabel.FromPosition = index + 1 - 0.3;
    customLabel.ToPosition = index + 1 + 0.3;
    customLabel.GridTicks = GridTickTypes.None;
    ChartContracts.ChartAreas["Contract"].AxisX.CustomLabels.Add(customLabel);
   }
   //Set the min and max values for Y and Y2 axes
   minDate = minDate.AddDays(-minDate.DayOfYear + 1); //Set min value first day of the year
   maxDate = maxDate.AddYears(3).AddDays(-maxDate.DayOfYear + 1);//Set max value last day of the year and add 2 year for better appeareance
   ChartContracts.ChartAreas["Contract"].AxisY.Minimum = ChartContracts.ChartAreas["Contract"].AxisY2.Minimum = minDate.ToOADate();
   ChartContracts.ChartAreas["Contract"].AxisY.Maximum = ChartContracts.ChartAreas["Contract"].AxisY2.Maximum = maxDate.ToOADate();
   //Set X axe label format
   ChartContracts.Series["Serie"].Label = "du #VALY{dd/MM/yyyy} au #VALY2{dd/MM/yyyy}";
   //Add today red line
   ChartContracts.ChartAreas["Contract"].AxisY.StripLines.Add(new StripLine { BorderColor = Color.Red, IntervalOffset = DateTime.Now.Date.ToOADate() });
   //Draw GridTickMarks on the Y and Y2 Axes 
   double value = ChartContracts.ChartAreas["Contract"].AxisY2.Maximum - ChartContracts.ChartAreas["Contract"].AxisY2.Minimum;
   int years = maxDate.Year - minDate.Year + 1;
   for (double index = ChartContracts.ChartAreas["Contract"].AxisY2.Minimum; index <= ChartContracts.ChartAreas["Contract"].AxisY2.Maximum; index += value / years)
   {
    ChartContracts.ChartAreas["Contract"].AxisY.CustomLabels.Add(index, index, string.Empty).GridTicks = GridTickTypes.TickMark;
    ChartContracts.ChartAreas["Contract"].AxisY2.CustomLabels.Add(index, index, string.Empty).GridTicks = GridTickTypes.TickMark;
   }
   //Draw years on the Y and Y2 Axes
   int tempYear = minDate.Year;
   for (double index = ChartContracts.ChartAreas["Contract"].AxisY2.Minimum; index < ChartContracts.ChartAreas["Contract"].AxisY2.Maximum; index += value / years)
   {
    ChartContracts.ChartAreas["Contract"].AxisY.CustomLabels.Add(index, index + value / years, tempYear.ToString());
    ChartContracts.ChartAreas["Contract"].AxisY2.CustomLabels.Add(index, index + value / years, tempYear.ToString());
    tempYear++;
   }
   //Set the Height of the chart
   ChartContracts.Height = 100 + (ChartContracts.Series["Serie"].Points.Count - 1) * 50;
   string postbackScript = ClientScript.GetPostBackEventReference(ChartContracts, "chart:@");
   ChartContracts.Attributes["onclick"] = postbackScript.Replace("@'", "' + getCoordinates(event)");
  }

protected void ChartContracts_Click(object sender, ImageMapEventArgs e)
{
   if (string.IsNullOrEmpty(e.PostBackValue)) return;
   Response.Redirect(string.Format("~/ContractDetails.aspx?ContractId={0}",e.PostBackValue));
}

Kind regards,
Dumitru