# Choosing Charts

Although changing from one chart to another is different, they possess several similarities between them. Since they are relatively easy to use, we will bring you up to speed in a jiffy.

{% hint style="info" %}
Remember, you can't use the chart view without having a number field type on your board.
{% endhint %}

## Step 1

To use the chart view, you need to learn how to interchange your board views willingly. [Click here to find out more](../changing-your-board-views). You will be redirected to a page where more information will be made available.

## Step 2

Select the type of chart you would like to view. Quabbly current offers three(3) types of charts: Bar Chart, Pie Chart, and Component Bar Chart. The image below shows how to select your preferred Chart type.

![Select your Chart type](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP8rJ5gs-J7_UxGmP3E%2Fchart%201%20\(1\).png?alt=media\&token=918e094f-cfb7-4efc-bc0f-a3f7721431ab)

Now, this is where diversity begins.

### For Bar Charts

![](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP94P-9OUwyIv_FDuLh%2FScreenshot%20\(27\).png?alt=media\&token=3f104cef-ed51-4988-ba3e-f3065efef808)

Having selected the bar charts, you are left with an empty board, and maybe you have a surprised face because you expected to see your chart. However, the process is not over yet.  Notice the section by the right-hand side that reads **Charts Settings.** Let's head over there now.

#### The X-Axis

The X-Axis option offers a dropdown which showcases the various potential fields eligible to stand as the X-Axis in your soon to be plotted chart.

![Select the X-Axis](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP97S3VCvTul5tDON3h%2Fcharts%204.png?alt=media\&token=ce0fe69e-76bc-443f-a1fe-5e868faf4f1c)

#### The Y-Axis

The Y-Axis option also offers a dropdown which showcases the various potential fields eligible to stand as the Y-Axis in your soon to be plotted chart. However, only fields with the number field type can occupy the Y-Axis.

![Select the Y-Axis ](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP99-95xnjoChlNTgi0%2Fchart%205.png?alt=media\&token=872156e3-1f3e-461e-8a63-611cab011d1b)

**One more step...**

The X-axis and the Y-axis have now been selected, click on **Plot Chart** to view the result.

![A completed bar chart](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP9JTsMBB8g2Yp0_TTN%2FChart%20view%206.png?alt=media\&token=f3d2aa4b-7aaa-40ee-af8b-9cbc96be8778)

### For Pie Charts

First, change the chart type to the pie chart. After this step, choosing a pie chart is the same as that of a bar chart. Head over to the **Chart Settings,** and let's begin.

#### The X-Axis

The X-Axis option offers a dropdown which showcases the various potential fields eligible to stand as the X-Axis in your soon to be plotted chart. The X-Axis represents the sectors of the Pie Chart.

![Select the X-Axis](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP9jSFxVA0WL7wlPvF9%2FCharts%207.png?alt=media\&token=a1f9cc03-d1cf-4c8b-9e39-c8d7a088067c)

#### The Y-Axis

The Y-Axis option also offers a dropdown which showcases the various potential fields eligible to stand as the Y-Axis in your soon to be plotted chart. However, only fields with the number field type can occupy the Y-Axis. The value contained in the chosen Y-Axis will determine the angle degrees of each sector.

![Select the Y-Axis](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP9jrL0HYBFyzy6pJI9%2Fcharts%208.png?alt=media\&token=0d7ac439-9b89-46ac-ac4d-4a30fd32a744)

**One more step...**

The X-axis and the Y-axis have now been selected, click on **Plot Chart** to view the result.

![A completed Pie chart  ](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP50Y4VB5nRP0qf8cTX%2F-MP9mWhnGWDqNlL4B8XW%2FCharts%209.png?alt=media\&token=6dd52c06-37e5-403c-9cf2-609c75fb669f)



### For Component Bar Charts

Since the component bar chart is technically different from the normal bar chart, a different condition applies.&#x20;

{% hint style="info" %}
**Condition**: There should be a minimum of two number field type to construct a component bar chart.&#x20;
{% endhint %}

#### &#x20;The X-Axis&#x20;

The X-Axis option provides a dropdown option which showcases the various potential fields eligible to stand as the X-Axis in your soon to be plotted component bar chart.

![](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP9r-PtfEoyXIEcen9A%2F-MPABif4ShWwmZI1Sk9t%2FUntitled%20design%20\(5\).png?alt=media\&token=ccead088-1f9c-40ef-98be-7368a411fad9)

Select the X-Axis field and check the boxes of the fields which would make up the opposite side.

![](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MP9r-PtfEoyXIEcen9A%2F-MPABoN0RUzqX0n6TvN-%2FUntitled%20design%20\(6\).png?alt=media\&token=c798e235-3096-468c-beee-d48c2c0359dd)

Now click on **Plot Chart**.

![A component Bar Chart](https://2355679203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MKVGdGBXO7mTN51Sodu%2F-MPACKFzOXO-xUomha9G%2F-MPACcFNfTUiMixAk9Y6%2FUntitled%20design%20\(7\).png?alt=media\&token=75c0ccca-301d-433f-9e66-0133c8a3f1c8)



{% hint style="success" %}
Fun Fact: Certain Charts tend to change colour combinations when the Plot Chart option is clicked on repeatedly.
{% endhint %}
