Microsoft Chart Controls and MOSS2007

I've known the existence of this controls for long, but I've never had the urge to use them. A couple of times I've needed a graph I've created it drawing dots in a bitmap (obviously the simpler way)
But now at Manigent we have to deliver a lot of complex charts... I thought I could use Excel Services but it does not make sense to export data from the sharepoint object model to an Excel book and create the graph from there so I decided it would be a good chance to learn how to use the .Net charting controls.

First of all I followed the steps on this blog to set up the development environment:

• ASP.NET and Windows Forms Chart Controls for .NET Framework 3.5 SP1
• Language Pack for ASP.NET and Windows Forms Chart Controls (if you install a non English version)
• Visual Studio 2008 Add-on for the Chart Controls
• Installation instructions for Chart Controls for .NET Framework and the documentation of the API. (if you are that kind of person)

Of course I didn't read the instructions and I went straight to the creation of the webpart.
First thing I did was to add the reference to the System.Web.DataVisualization DLL which was installed in C:\Program Files\Microsoft Chart Controls\Assemblies\

That's enough for you to start creating the webpart with Visual Studio. The code I used for the webpart was an adaptation of an example from the documentation:

public class ControlAssessmentChart : Microsoft.SharePoint.WebPartPages.WebPart
    {
        Chart Chart1 = new Chart();

        protected override void CreateChildControls()
        {
            Chart1.Width = 400;
            Chart1.Height = 300;
            Chart1.RenderType = RenderType.ImageTag;

            Chart1.Palette = ChartColorPalette.BrightPastel;
            Title t = new Title("StratEx Testing Chart", Docking.Top,
                new System.Drawing.Font("Trebuchet MS", 14, System.Drawing.FontStyle.Bold)
                , System.Drawing.Color.FromArgb(26, 59, 105));
            Chart1.Titles.Add(t);
            Chart1.ChartAreas.Add("Test 1");

            // create a couple of Test
            Chart1.Series.Add("Test 1");
            Chart1.Series.Add("Test 2");

            //ChartType can also be added to the series
            // add points to Test 1
            Chart1.Series["Test 1"].Points.AddY(5);
            Chart1.Series["Test 1"].Points.AddY(8);
            Chart1.Series["Test 1"].Points.AddY(12);
            Chart1.Series["Test 1"].Points.AddY(6);
            Chart1.Series["Test 1"].Points.AddY(9);
            Chart1.Series["Test 1"].Points.AddY(4);

            // add points to Test 2
            Chart1.Series["Test 2"].Points.AddY(2);
            Chart1.Series["Test 2"].Points.AddY(6);
            Chart1.Series["Test 2"].Points.AddY(18);
            Chart1.Series["Test 2"].Points.AddY(16);
            Chart1.Series["Test 2"].Points.AddY(21);
            Chart1.Series["Test 2"].Points.AddY(14);

            Chart1.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
            Chart1.BorderColor = System.Drawing.Color.FromArgb(26, 59, 105);
            Chart1.BorderlineDashStyle = ChartDashStyle.Solid;
            Chart1.BorderWidth = 2;

            Chart1.Legends.Add("Legend1");

            Chart1.Legends["Legend1"].Enabled = true;

            Controls.Add(Chart1);
        }
    }

After deploying the webpart in sharepoint I tried to run it but I got the error:

[HttpException (0x80004005): Error executing child request for ChartImg.axd.]

To solve it I followed the tip at this forum and added the line:

<add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>

To the web.config (inside <system.web><httpHandlers>)
After that I tried to run the webpart again but I got:

[DirectoryNotFoundException: Invalid temp directory in chart handler configuration [c:\TempImageFiles\].]

To solve this new issue I had to follow the instructions at this post and added:

<add key="ChartImageHandler" value="storage=file;timeout=20;" />

In the web.config inside <appSettings>

Finally it worked!.

These charts belong to the same data set (is not the same in the code) but changing the ChartType parameter in the series.

It looks really powerful, let's see how it performs in production…