# Combination Chart

You can create a combination chart to represent multiple series as different chart types. For instance, a chart showing sales and profit can be created with sales shown as bars and profit shown as a line or area chart. In addition each of these metrics can use their own axis.

## Inputs <a href="#inputs" id="inputs"></a>

Metrics - 1 or more metrics\
Attributes - 1 or more attributes<br>

### Series

‘Scatter’ is removed from series types. It is now replaced by data markers. And also width property is added in series tab to independently adjust the width of each series. See the screenshot below

<figure><img src="https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2FtlbpS5DSwB2dQmrUxx9r%2Fimage.png?alt=media&#x26;token=65fa1c84-941b-43af-8ee0-3e11b8995ee5" alt="" width="375"><figcaption></figcaption></figure>

## Steps to create a Combination chart <a href="#steps-to-create-a-combination-chart" id="steps-to-create-a-combination-chart"></a>

Combination chart can be created using the series tab in property editor of Line/Bar/Column/Area charts

### **Step 1:**

Create a column chart for example with 2 metrics profit and revenue as shown in the screenshot below.

<figure><img src="https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2F515AmEdTHszOl8cWXATR%2FComb_chart_1.png?alt=media&#x26;token=d36569ca-e37a-49e5-8100-2b9abb851cd0" alt=""><figcaption></figcaption></figure>

### **Step 2:**

Now open the property editor and go to the series tab. Click on the edit button for revenue metric as shown in the screenshot below\ <br>

<figure><img src="https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2FzZuZlfKbK5EJAagORY2b%2FComb_chart_2.png?alt=media&#x26;token=8425ac88-0425-490f-a774-a098a07a62e2" alt=""><figcaption></figcaption></figure>

### **Step 3:**

Select the series type for revenue metric as ‘Line’, width as ‘2’ and click on apply as shown in the below screenshot

![](https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2FN741NVoxe8DcHydUE7Ty%2Fimage.png?alt=media\&token=fdfe493e-79ab-4978-9f2a-0992bdf1d875)

And the combination chart will now be created as shown in the screenshot below.\ <br>

<figure><img src="https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2FzJ43YwkbFAFAd4skirAh%2FComb_chart_4.png?alt=media&#x26;token=e4cd536a-7ec2-4beb-b54b-705d000dddc5" alt=""><figcaption></figcaption></figure>

### **Step 4:**

We can also set the series to be on the secondary axis for one of the metric. See the screenshot

![](https://docs.vitaracharts.com/~gitbook/image?url=https%3A%2F%2F230207405-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FOuiTPVEbVQnzR38vviPf%252Fuploads%252Fs83ziKQzM1T0A8XRvLmR%252Funknown.png%3Falt%3Dmedia%26token%3D00314acc-d407-4b44-aae6-d1dee3623007\&width=300\&dpr=3\&quality=100\&sign=38257b1b\&sv=2)

And below screenshot shows how the chart looks after enabling the series on secondary axis

<figure><img src="https://106821559-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuIDde50GEkigLbPmGgLx%2Fuploads%2FTKwbUmODj1YCtZdU8e3Q%2FComb_chart_6.png?alt=media&#x26;token=60dc9f68-a70f-4fdd-b78a-e4e35d79c164" alt=""><figcaption></figcaption></figure>

## Data Markers <a href="#data-markers" id="data-markers"></a>

The data markers feature is introduced in the Bar/Column/Line/Area/Sparkline charts. To know about **Data Markers** feature please click [*Here*](https://tsdocs.vitaracharts.com/readme/data-markers).