WebChart Control Sample - Generating charts on the server

| Contact

Sample of using the Chart control without saving to the file system

One of the original designs for WebChart was exposing its features to both WebForms and WinForms development.
To achieve this, all the rendering functionality of the control is handled by a small Engine that I called ChartEngine. The WebChart control is only a “wrapper” WebControl to use features like the VS.NET designer, and other functionality in Web Applications. Due to lack of time I haven’t finished the WinForms “wrapper”, but the features can still be used regardless.

Any way, one good thing of this design is that you can easily create your own “wrapper” so you can create an HTTP Handler to stream down charts or anything you want.

This is just a sample on how you can generate a chart, of course you might want to reference this page from another page using an IMG like:
<img href=”TheChartPage.aspx” />
So that you can add other HTML content around the chart image.

You might want to create a handler that caches images, or something more sophisticated, but the idea is the same. Let me know if you need more info.

Save the following code in an .ASPX page and copy the WebChart.dll in the bin directory of the application directory. Request the page and you will get a chart that will not be saved in any place.
Warning: This code will always generate the chart for every request, so you might want to do things like caching the image to increase the web server performance.

<%@ Page Language="VB" contenttype="image/png" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="WebChart" %>
<script runat=server>
    Sub Page_Load(ByVal o As Object, ByVal e As EventArgs)
        Dim wcEng As New ChartEngine()
        wcEng.Size = New Size(200, 200)

        Dim wcCharts As New ChartCollection(wcEng)
        wcEng.Charts = wcCharts

        Dim slChart As New SmoothLineChart()
        slChart.Line.Color = Color.Red
        slChart.Legend = "Watts"
        slChart.ShowLineMarkers = False
        slChart.ShowLegend = False

        slChart.Data.Add(New ChartPoint("One", 12))
        slChart.Data.Add(New ChartPoint("Two", 22))
        slChart.Data.Add(New ChartPoint("Three", 2))

        wcCharts.Add(slChart)

' Uncomment this line to Set-up Optional properties on the chart
' SetMoreProperties(wcEng)
        Dim bmp As Bitmap
        Dim memStream As New System.IO.MemoryStream()
        bmp = wcEng.GetBitmap()
        bmp.Save(memStream, System.Drawing.Imaging.ImageFormat.Png)
        memStream.WriteTo(Response.OutputStream)
        Response.End()
    End Sub
</script>

I have received a lot of questions about this sample on how to make some things work (like titles, borders, etc).
Here is a function that you can call from the code above before the GetBitmap() to set some values:

    ' This are all Optional properties, You can call this method to change the look of your chart
    Private Sub SetMoreProperties(ByVal engine As ChartEngine)
        ' Set-up the XTitle
        Dim myFont As New System.Drawing.Font("Tahoma", 8)
        engine.XTitle = New ChartText()
        Dim horizontalFormat As New StringFormat()
        horizontalFormat.LineAlignment = StringAlignment.Far
        engine.XTitle.StringFormat = horizontalFormat
        engine.XTitle.Text = "This is the XTitle"
        engine.XTitle.Font = myFont

        ' Set-up the YTitle
        engine.YTitle = New ChartText()
        engine.YTitle.Font = myFont
        Dim verticalFormat As New StringFormat()
        verticalFormat.FormatFlags = StringFormatFlags.DirectionVertical
        verticalFormat.Alignment = StringAlignment.Near
        engine.YTitle.StringFormat = verticalFormat
        engine.YTitle.Text = "This is the YTitle"

        ' Set-up the Title
        engine.Title = New ChartText()
        engine.Title.Text = "This is the Chart Title"

        ' Specify show XValues
        engine.ShowXValues = True
        engine.ShowYValues = True

        ' Some padding
        engine.Padding = 30
        engine.ChartPadding = 30

        ' some color
        engine.Background.Color = Color.FromArgb(70, Color.DarkBlue)

        ' some color
        engine.PlotBackground.Color = Color.LightYellow
    End Sub