sgray128 11/16/2011 9:15:37 AM

Telerik - How To Create A Line Chart And Save It To Disk

This article will show how to create a line chart using the Telerik Win Form charting controls and save it to disk

In a recent project I needed to set out statistics to users. I had the idea of creating a chart, saving it to disk, and then emailing it out nightly. In the code sample below I walk through the process of creating the chart and then saving it. 

In a separate article I'll cover how to include it in an email. 

It's all pretty self explanatory, but one difficulty I had was in dealing with the dates. The chart doesn't handle date types, you have to convert them to Julian dates in the SQL query to get them to work, like this:

datediff(day,'1/1/1900',logdate) + 2 as julianDate

You'll also see 'ToAODate()' in the code, that's the VB way of doing the same thing. 

    Private Sub CreateChart(ByVal oDT As DataTableByVal dtStartDate As DateByVal dtEndDate As Date)
        'creates a jpeg image of a chart on disk with no visual control
        ' Public WithEvents RadChart1 As New RadChart
        Dim RadChart1 As New RadChart
            RadChart1.Legend.Appearance.Position.Auto = False
            RadChart1.Legend.Appearance.Position.X = 200
            RadChart1.Legend.Appearance.Position.Y = 200
            RadChart1.ChartTitle.TextBlock.Text = "Web Traffic"
            RadChart1.DefaultType = ChartSeriesType.Line
            RadChart1.SeriesOrientation = ChartSeriesOrientation.Vertical
            'right margin of the main grid surface
            RadChart1.Width = 1000
            RadChart1.Height = 700
            RadChart1.PlotArea.Appearance.Dimensions.Margins.Right = Telerik.Charting.Styles.Unit.Pixel(50)
            RadChart1.PlotArea.Appearance.Dimensions.Margins.Left = Telerik.Charting.Styles.Unit.Pixel(50)
            RadChart1.PlotArea.Appearance.Dimensions.Margins.Top = Telerik.Charting.Styles.Unit.Pixel(70)
            RadChart1.PlotArea.Appearance.Dimensions.Margins.Bottom = Telerik.Charting.Styles.Unit.Pixel(50)
            'change the background color
            'RadChart1.PlotArea.Appearance.FillStyle.MainColor = System.Drawing.Color.White
            'RadChart1.PlotArea.Appearance.FillStyle.SecondColor = System.Drawing.Color.LightSkyBlue
            'add a little room at the top of the chart
            RadChart1.PlotArea.YAxis.AxisMode = ChartYAxisMode.Extended
            RadChart1.PlotArea.XAxis.AutoScale = False
            RadChart1.PlotArea.XAxis.LayoutMode = Styles.ChartAxisLayoutMode.Normal
            RadChart1.PlotArea.XAxis.Appearance.ValueFormat = Styles.ChartValueFormat.ShortDate
            RadChart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = "45"
            RadChart1.PlotArea.XAxis.AddRange(dtStartDate.ToOADate(), dtEndDate.ToOADate(), 1)
            'add a line for Pageviews
            Dim chartSeries As Telerik.Charting.ChartSeries
            chartSeries = New Telerik.Charting.ChartSeries("PageViews"ChartSeriesType.Line)
            chartSeries.DataYColumn = "PageViews"
            chartSeries.DataXColumn = "julianDate"
            chartSeries.Appearance.ShowLabels = True
            'add a line for UniqueVisitors
            ChartSeries = New Telerik.Charting.ChartSeries("UniqueVisitors"ChartSeriesType.Line)
            chartSeries.DataXColumn = "julianDate"
            chartSeries.DataYColumn = "UniqueVisitors"
            chartSeries.Appearance.ShowLabels = True
            'add a line for NewVisitors
            chartSeries = New Telerik.Charting.ChartSeries("NewVisitors"ChartSeriesType.Line)
            chartSeries.DataXColumn = "julianDate"
            chartSeries.DataYColumn = "NewVisitors"
            chartSeries.Appearance.ShowLabels = True
            RadChart1.DataManager.DataSource = oDT
            RadChart1.Save("WebTraffic.jpg", System.Drawing.Imaging.ImageFormat.Jpeg)
            'opens a web browser and shows the image. 
            '(just for testing)
        Catch ex As Exception
        End Try
    End Sub