---
product: "AG Charts"
title: "Combination Charts"
description: "Create Angular Combination Charts by combining two or more series types for more flexible data visualisations. Add a secondary axis to handle different scales."
framework: angular
version: "14.2.0"
related:
    - title: "Bar"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/bar-series/"
    - title: "Line"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/line-series/"
    - title: "Area"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/area-series/"
    - title: "Scatter"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/scatter-series/"
    - title: "Bubble"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/bubble-series/"
    - title: "Pie"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/pie-series/"
    - title: "Donut"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/donut-series/"
    - title: "Box Plot"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/box-plot-series/"
    - title: "Candlestick"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/candlestick-series/"
    - title: "OHLC"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/ohlc-series/"
    - title: "Heatmap"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/heatmap-series/"
    - title: "Histogram"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/histogram-series/"
    - title: "Nightingale"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/nightingale-series/"
    - title: "Radar Area"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/radar-area-series/"
    - title: "Radar Line"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/radar-line-series/"
    - title: "Radial Bar"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/radial-bar-series/"
    - title: "Radial Column"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/radial-column-series/"
    - title: "Range Area"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/range-area-series/"
    - title: "Range Bar"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/range-bar-series/"
    - title: "Waterfall"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/waterfall-series/"
    - title: "Sunburst"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/sunburst-series/"
    - title: "Treemap"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/treemap-series/"
    - title: "Sankey"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/sankey-series/"
    - title: "Chord"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/chord-series/"
    - title: "Funnel"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/funnel-series/"
    - title: "Cone Funnel"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/cone-funnel-series/"
    - title: "Pyramid"
      url: "https://www.ag-grid.com/charts/archive/14.2.0/angular/pyramid-series/"
llms: "https://www.ag-grid.com/charts/archive/14.2.0/llms.txt"
---

# Combination Charts

A combination chart combines two or more series types allowing for flexible data visualisations. They are ideal for making visual comparisons of different sets of data in a single chart.

## Combination Series Types

It is possible to create Combination Charts using the following series types: `bar`, `line`, `area`, `scatter` and `bubble`.

The `type` property must be specified explicitly on each individual series object in the `series` options array, as shown below:

```js
{
    series: [
        {
            type: 'bar', // use 'bar' series
            xKey: 'year',
            yKey: 'men',
            // ...other series options
        },
        {
            type: 'line', // use 'line' series
            xKey: 'year',
            yKey: 'portions',
            // ...other series options
        },
    ],
}
```

The snippet above shows the configuration required for a combination chart consisting of a `bar` and `line` series.

The example below demonstrates two common combination chart types. You can switch between these two combination chart types using the buttons above the chart. Please note:

- Series are rendered according to the order in which they are added in the `series` array.
- The area and line series are plotted on a [Secondary Axis](https://www.ag-grid.com/charts/archive/14.2.0/angular/axes-secondary/) with a different scale.

#### Combination Charts

```ts
// Angular entry point file
import '@angular/compiler';
import { bootstrapApplication } from '@angular/platform-browser';

import { AppComponent } from './app.component';

bootstrapApplication(AppComponent);
```

[Live example: Combination Charts](https://www.ag-grid.com/charts/archive/14.2.0/angular/combination-series/examples/combination/)

## Combination Chart Examples

See more Combination Chart examples in the [AG Charts Gallery](https://www.ag-grid.com/charts/archive/14.2.0/gallery/#combination).

- [Bar And Line Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/bar-line-combination/)
- [Histogram And Scatter Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/histogram-scatter-combination/)
- [Horizontal Range Bar And Scatter Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/horizontal-range-bar-scatter-combination/)
- [Radar Line, Radar Area And Nightingale Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/radar-line-radar-area-nightingale-combination/)
- [Grouped Category Axis Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/grouped-bar-line-combination/)
- [Step Interpolation Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/step-interpolation-combination/)
- [Bar, Line And Area Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/grouped-category-combination/)
- [Stacked Bar And Area Combination Chart Example](https://www.ag-grid.com/charts/archive/14.2.0/gallery/stacked-bar-area-combination/)
