The Basics of Charting with the MS Chart Control

Adding the Chart Control

Start a standard Visual Basic EXE project which comes with a form. Click on the menu item Project and then click on the drop-down menu item Components and wait a few seconds. You will see the following window. Scroll down and place a check mark against this component as shown. If you also place a check mark for Selected Items Only, only this item will be shown. Click Apply and this adds an icon for this control to your tool box, which you may see in the picture that follows.

Now click on the icon (bottom right) and draw it on the form as shown. This is the default view of this control on the form. It shows five rows and each of these rows has 4 columns differentiated by their color.

All ActiveX controls have Property Pages (a collection of tabbed pages) and also a Properties Window, listing properties that can be set at design time. This control has some 50 classes, each with many methods and properties. 

The next picture shows the Property Pages for this control. With this a number of properties can be set for this control by tabbing to the right page. Here you can choose the type of graph (chart), the Axes (x, y1, y2), the Series (the number of columns that you may have in your data), and so forth.

The Properties window shows the default values for the chart, displayed here. We will only examine a couple of properties and methods to get some basic understanding of how this control works.

What if the Chart Control is not installed?

Depending on the VB version, you may or may not find the control. In this case, you need to download it from a location where it may be available. One such location is in the UK and comes in the form of a ZIP file containing the control (if the link is not active, you may have to search for other locations). After unzipping, place the content in the C:WindowsSystem32 directory, the directory for all ActiveX controls. After this you need to register it in the Windows registry by executing the following in your DOS window (type it in and hit return).

C:windowsSystem32> regsvr32 mschrt20.ocx

You should get a RegSvr32 message that says DLLRegisterServer in mschrt20.ocx succeeded. If you still do not find it in the components screen, you can click on the Browse... button on the screen that matches the first picture in this tutorial. It opens the System32 folder, where you can locate it as shown in the next picture.

Organization of the chart

Although we see only a chart on the form, it has an organization that is not easily visible in this default view. In order to access the properties and methods, one needs to understand the structure. The chart consists of the following areas:

• Title
• Legend
• Footnote
• Plot

These regions are revealed using the code shown in the next paragraph, written to the form load event:

Private Sub Form_Load()

With MSChart1

'title area

.Title.Text = "Great Chart"

'legend area

.ShowLegend = True

'footnote area

.FootnoteText = "This is a foot note"

.Footnote.VtFont.VtColor.Set 25, 150, 200

'plot area

.Plot.Backdrop.Fill.Style = VtFillStyleBrush

.Plot.Backdrop.Fill.Brush.FillColor.Set 100, 200, 200

End With

End Sub

This form will show up as shown in the next picture when the code is run. It is easy to associate the code with the displayed chart. Once you understand this organization, it is somewhat easier to access the properties and methods. Unfortunately Microsoft's documentation on this is rather sparse, and where available you find only undecipherable references. The related product in Office is very superior to this control and better documented.

As you can guess from looking at the code, the properties and methods can be accessed by the dot notation and the intellisense support. Without this support this would have been an impossible control to use. To fill the chart's plot area background, look at this code. Honestly I would not have guessed this statement. Hats off to intellisense.

MSChart1.Plot.Backdrop.Fill.Brush.FillColor.Set 100, 200, 200

Getting into the plot area

Let's get some data into the plot area to see how this can be managed. The code shown in the next picture creates labels for the rows and the columns (Series). It also associates some data, albeit contrived to show how the data gets into the plot. Use another form in the same project, drop a chart control on the form, and to the form's load event, use the code shown in the next paragraph.

Private Sub Form_Load()

MSChart1.ToDefaults

With MSChart1

    .ShowLegend = True

    .Column = 1

    .ColumnLabel = "red"

    .Column = 2

    .ColumnLabel = "green"

    .Column = 3

    .ColumnLabel = "blue"

    .Column = 4

    .ColumnLabel = "yellow"

    .Column = 5

    .ColumnLabel = "magenta"

    .Row = 1

    .RowLabel = "First"

    .Row = 2

    .RowLabel = "Second"

    .Row = 3

    .RowLabel = "Third"

    .Row = 4

    .RowLabel = "Four"

End With 

For i = 1 To 4

With MSChart1

    .Row = i

    .Column = 1

    .Data = 200 + 50 * i

    .Column = 2

    .Data = 300

    .Column = 3

    .Data = 400 - 10 * i

    .Column = 4

    .Data = 500 - 20 * i

    .Column = 5

    .Data = 100

End With

Next i 

End Sub 

When the above code is executed the chart is displayed as shown in the next picture. The code syntax is not intuitive, especially concerning the current row and current column. You need to define a column by using the variable 'Column'; confer a label on it using 'ColumnLabel'; and associate a 'data' with it using 'data'. This setting in the Properties window is especially confusing. What's more, the definition in design may override the run time values.

As for the data, the red bar increases; the blue and yellow bars decrease; and magenta and green stay constant. The chart appears to be automatically scaled. The title and foot note are left out.

Summary

This basic tutorial is a 101 level presentation of MS Chart Control. The material is very basic, but gives a good idea of how it is organized and how data may be plotted. Although individual data points have been associated with the rows and columns, the chart can be linked to data arrays as well as ADO and ActiveX Data Objects.