datachart-multiple-series.adoc

Adding Multiple Series

This topic explains, with code examples, how to create composite charts by plotting multiple types of series in the same plot area of the {DataChartName}™ control.

Overview

The topic is organized as follows:

• Introduction

• Examples

  • Multiple Series from Mixed Groups of Series

  • Multiple Overlaid Series

  • Multiple Clustered Series

• Related Topics

Introduction

The {DataChartName} supports plotting unlimited number of Series in the same chart plot area. This is accomplished by adding the various types of Series objects to the {DataChartName} control’s Series collection. Each series that is added to the chart must have a pair of appropriate types of Axis and data member mapping. For more information on this refer to the Series Requirements topic. In addition to support of plotting multiple series in any combination, some types of axes can be shared between various series (see Table 1) making composite charts a much easier process.

The following table shows types of axes supported by various series and which axes can be shared between different series in the Data Chart. Refer to the Examples section of this topic and to the Multiple Axes topic for more information on how to share axes.

Type of Category Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Bar Series	NumericXAxis	CategoryYAxis	N/A	N/A
Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Column Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Line Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Point Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Range Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Range Column Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Spline Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Spline Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Step Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Step Line Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Waterfall Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A

Type of Stacked Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Stacked Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked Column Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked Line Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked Spline Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked Spline Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked 100-Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked 100-Column Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked 100-Line Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked 100-Spline Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked 100-Spline Area Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Stacked Bar Series	NumericXAxis	CategoryYAxis	N/A	N/A
Stacked 100-Bar Series	NumericXAxis	CategoryYAxis	N/A	N/A

Type of Financial Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Financial Price Series	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Absolute Volume Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Accumulation Distribution Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Average Directional Index Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Average True Range Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Bollinger Bands Overlay	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Bollinger Band Width Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Chaikin Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Chaikin Volatility Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Commodity Channe lIndex Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Detrended Price Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Ease Of Movement Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Fast Stochastic Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
ForceIndex Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Full Stochastic Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Market Facilitation Index Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
MassIndex Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
MedianPrice Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
MoneyFlowIndex Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Moving Average Convergence Divergence Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Negative Volume Index Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
OnBalance Volume Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Percentage Volume Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Positive Volume Index Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
PriceVolume Trend Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Price Channel Overlay	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Rate of Change And Momentum Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Relative Strength Index Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Slow Stochastic Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Standard Deviation Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
StochRSI Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
TRIX Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Typical Price Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Ultimate Oscillator Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Weighted Close Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A
Williams PercentR Indicator	CategoryXAxis, CategoryDateTimeXAxis	NumericYAxis	N/A	N/A

Type of Scatter Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Scatter (Point) Series	NumericXAxis	NumericYAxis	N/A	N/A
Scatter Line Series	NumericXAxis	NumericYAxis	N/A	N/A
Scatter Spline Series	NumericXAxis	NumericYAxis	N/A	N/A

Type of Polar Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Polar Area Series	N/A	N/A	NumericRadiusAxis	NumericAngleAxis
Polar Line Series	N/A	N/A	NumericRadiusAxis	NumericAngleAxis
Polar Scatter Series	N/A	N/A	NumericRadiusAxis	NumericAngleAxis
Polar Spline Series	N/A	N/A	NumericRadiusAxis	NumericAngleAxis
Polar Spline Area Series	N/A	N/A	NumericRadiusAxis	NumericAngleAxis

Type of Radial Series	Valid X-Axis	Valid Y-Axis	Valid Radius Axis	Valid Angle Axis
Radial Area Series	N/A	N/A	NumericRadiusAxis	CategoryAngleAxis
Radial Line Series	N/A	N/A	NumericRadiusAxis	CategoryAngleAxis
Radial Column Series	N/A	N/A	NumericRadiusAxis	CategoryAngleAxis
Radial Pie Series	N/A	N/A	NumericRadiusAxis	CategoryAngleAxis

Note	Note: Some financial indicator series (e.g. BollingerBandsOverlay and ChaikinOscillatorIndicator) have different range of values on y-axis and they should be plotted in separated charts or have unique y-axes in the same chart. For more information, please refer to the Using Multiple Axes topic.

Examples

This section provides a few examples of using multiple series in the {DataChartName} control. Refer to topics for individual types of series for more information on data rendering rules.

Multiple Series from Mixed Groups of Series

From the previous section, you learned that series can be mixed from different groups of series. An example of this is usage of the LineSeries type from the Category Series group and the FinancialPriceSeries type from the Financial Series group. In this example, the LineSeries will plot volume of stock market and the FinancialPriceSeries type will plot stock prices (open, high, low, and close) in the same chart plot area. In addition these two series will share x-axis in order to align data points horizontally. You can apply the same logic for plotting other types of series in any combinations you want as long as Series Requirements are met.

Figure 1 – Sample implementation of LineSeries and FinancialPriceSeries sharing the same x-axis.

Multiple Overlaid Series

In the {DataChartName}, multiple series that do not share the same x-axis are rendered on top of each other (figure 2). The first series in the Series collection of the {DataChartName} control renders first and all successive series overlap the previous series. Therefore, it is recommended you use semi-transparent brushes for these series, cluster column series by sharing the same x-axis, or plot them in separate charts. In addition, adding a LineSeries to the chart that already has a ColumnSeries will render data points of the LineSeries in the middle of columns of the ColumnSeries (figure 3). This rendering rule also applies to all other non-column types of series (e.g. AreaSeries, SplneSeries etc.) when they are plotted with the ColumnSeries in the {DataChartName} control.

Figure 2 – Overlaid two ColumnSeries objects.

Figure 3 - Overlaid two ColumnSeries objects and one LineSeries object.

The following code example demonstrates plotting multiple overlaid ColumnSeries with a LineSeries.

Multiple Clustered Series

Multiple column series that share the same x-axis are rendered in clusters where each cluster represents a data point (figure 4). The first series in the Series collection of the {DataChartName} control renders as a column on the left of the cluster. Each successive series is rendered on the right of the previous series. However, adding the LineSeries type of series to clustered column series renders data points of the LineSeries in the center of the clusters (figure 5).

Figure 4 - Clustered two ColumnSeries objects

Figure 5 - Clustered two ColumnSeries objects with one LineSeries object

The following code example demonstrates plotting multiple clustered ColumnSeries with a LineSeries.

Related Content

Configuring Axis Range

Series

Series

Indicators

Scatter Series

Series Requirements