How To Create a Combination Chart with the Chart Web Component

Article translations Article translations
Article ID: 240263 - View products that this article applies to.
This article was previously published under Q240263
This article has been archived. It is offered "as is" and will no longer be updated.
Expand all | Collapse all

SUMMARY

This article describes how you can create a combination chart using the Chart Office Web Component.

MORE INFORMATION

A combination chart can include Series with Columns, Lines, or Areas. To create a combination Chart, set the Type property of each series. To illustrate, you could use the following code to create an Area/Column combination Chart from a Chart with two series:

Sample Code

<html>
<body>

<object id=ChartSpace1 classid=CLSID:0002E500-0000-0000-C000-000000000046 style="width:100%;height:350"></object>

<script language=vbscript>

Sub Window_OnLoad()

    Dim oChart
    Dim oSeries1, oSeries2
    dim oConst
    
    'Ensure ChartSpace1 is empty:
    ChartSpace1.Clear

    Set oConst = ChartSpace1.Constants

    'Create a new chart in the ChartSpace
    Set oChart = ChartSpace1.Charts.Add
    
    'Add a series of type Column
    Set oSeries1 = oChart.SeriesCollection.Add
    With oSeries1
        .Caption = "Sales"
        .SetData oConst.chDimCategories, oConst.chDataLiteral, _
                 Array("1994", "1995", "1996", "1997")
        .SetData oConst.chDimValues, oConst.chDataLiteral, _
                 Array(50, 60, 55, 59)
        .Type = oConst.chChartTypeColumnClustered
    End With
    
    'Add a second series of type Line
    Set oSeries2 = oChart.SeriesCollection.Add
    With oSeries2
        .Caption = "Profit"
        .SetData oConst.chDimCategories, oConst.chDataLiteral, _
                 Array("1994", "1995", "1996", "1997")
        .SetData oConst.chDimValues, oConst.chDataLiteral, _
                 Array(39, 47, 52, 46)
        .Type = oConst.chChartTypeLine
    End With
    
    'Add a second value axis to the Chart
    oChart.Axes.Add oChart.Scalings(oConst.chDimValues), _
                 oConst.chAxisPositionRight, oConst.chValueAxis

    'Display the legend
    oChart.HasLegend = True
    oChart.Legend.Position = oConst.chLegendPositionBottom
    
    'Display the title for the chart
    oChart.HasTitle = True
    oChart.Title.Caption = "Four Year Overview"

End Sub

</script>
</body>
</html>
				

Notes About Chart and Series Types

Both Charts and Series have a Type property. Setting the Type property of a Chart object changes the chart type for every Series in the Chart. Note that if you query the Type property of a combination Chart, the returned value is chChartTypeCombo (or -1). chChartTypeCombo indicates that the Series on the Chart has different types. You cannot set a Chart Type to chChartTypeCombo; if you do, you receive an error.

As mentioned earlier, a combination Chart can consist only of Series with types Column, Area, or Line. If you attempt to change a Series on a Chart to an incompatible type, all the Series types on the chart are changed. In other words, you change the Type property of the Chart object itself.

Notes About Value Axes

A combination chart can have two value axes. The Value axes on a chart always have the same scale. In a scenario where you have two series where the y-values are considerably different in value, the Series with the smaller values may look "dwarfed" by the Series with the larger values. Unfortunately, when using the ChartWeb component there is no way to avoid this behavior because the value axes cannot have different scales.

There are alternatives you might consider for using two series with very different values:
  • Create two separate charts in the ChartSpace. -or-

  • Create the chart in Microsoft Excel because Excel charts can have a different scale for the secondary y-axis. You could then publish the chart without interactivity by clicking Save As Web Page on the File menu. When you publish a chart in this manner, a picture of the chart is actually saved to a GIF file.

With the Office Web Components version 10 and version 11, you can have two value axis with different scales. For additional information, click the following article number to view the article in the Microsoft Knowledge Base:
286211 How To Create a Combination Chart Using the Office XP Chart Component or the Office 2003 Chart Component

REFERENCES

For additional information about using the Chart Web Component, please click on the number below to view the article in the Microsoft Knowledge Base:
235885 How To Use the Office Chart Web Component With VB
For information about programmatically creating a GIF file from a Microsoft Excel Chart, please click on the number below to view the article in the Microsoft Knowledge Base:
163103 How to Create a GIF File from a Microsoft Excel Chart

Properties

Article ID: 240263 - Last Review: October 22, 2013 - Revision: 2.2
APPLIES TO
  • Microsoft Office Chart Component 9.0, run time
Keywords: 
kbnosurvey kbarchive kbhowto KB240263

Give Feedback

 

Contact us for more help

Contact us for more help
Connect with Answer Desk for expert help.
Get more support from smallbusiness.support.microsoft.com