# Advanced pie chart

The Advanced Pie Chart displays data in a circle divided into segments or slices, which are proportional to the represented values. It is possible to create more complex charts than with [Basic Pie Charts](https://docs.appfarm.io/library/ui-components/basic-pie-chart). For example, the Category Property is not limited to some data types and more visual properties are available. &#x20;

## Usage

Advanced Pie Charts are used to show data as a percentage of a whole.&#x20;

{% hint style="info" %}
**Examples**

Advanced Pie Chart examples are available in our [Showroom](https://showroom.appfarm.app/ui-components/advanced-pie-chart). You can view the demo, as well as access the setup in Appfarm Create. Don't have access? [Register](https://showroom.appfarm.app/sign-up).
{% endhint %}

## Properties

| Property                 | Description                                                                                                                                                                                                                                                                                             |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Data Source**          | Select a data source to display as a chart.                                                                                                                                                                                                                                                             |
| **Filter**               | Apply a filter to the selected data source.                                                                                                                                                                                                                                                             |
| **Conditional Filters**  | Create conditional filters to apply to the selected data source.                                                                                                                                                                                                                                        |
| **Category Property**    | Select a data source to display as X Axis in the chart.                                                                                                                                                                                                                                                 |
| **Hide Empty**           | <p>Visible when <strong>Category Property</strong> is selected.</p><p></p><p>Enable to hide categories without content. </p>                                                                                                                                                                            |
| **Group By**             | <p>Visible when <strong>Category Property of data type Datetime</strong> is selected.</p><p></p><p>Select a dimension to group the data by. If no dimension is selected, all objects will be displayed in the order given by the data source.</p>                                                       |
| **Custom Format**        | <p>Visible when <strong>Category Property of data type Datetime and a Group By dimension</strong> is selected.</p><p></p><p>Define a custom format to override the format of the data source. Check <a href="https://momentjs.com/docs/#/displaying/format/">momentjs</a> for a complete reference.</p> |
| **Value Property**       | Select a data source to aggregate the data on. If no data source is selected, count will be used by default.                                                                                                                                                                                            |
| **Aggregation Function** | <p>Visible when <strong>Value Property</strong> is selected.</p><p></p><p>Select one of the functions Count, Sum, Average, Median, Minimum or Maximum to aggregate the data on.</p>                                                                                                                     |
| **Show Uncategorized**   | <p>Visible when <strong>Value Property</strong> is selected.</p><p></p><p>Enable to show uncategorized data as a separate category.</p>                                                                                                                                                                 |
| **Title**                | Enter a static title or bind it to a data source, function, date now or date today.                                                                                                                                                                                                                     |
| **Sub Title**            | Enter a static title or bind it to a data source, function, date now or date today.                                                                                                                                                                                                                     |
| **Show Legend**          | Enable to show a legend.                                                                                                                                                                                                                                                                                |
| **Legend Position**      | <p>Visible when <strong>Show Legend</strong> is enabled.</p><p></p><p>Position the legend on the top, left, bottom or right side of the chart.</p>                                                                                                                                                      |
| **Disable Animation**    | Enable to stop animation of the chart.                                                                                                                                                                                                                                                                  |
| **Disable Gradient**     | Enable to lighten up the color value.                                                                                                                                                                                                                                                                   |
| **Sort Sections By**     | Define how the sections should be sorted, either by value or by category.                                                                                                                                                                                                                               |
| **Sort Order**           | By default the values are sorted descending. It is also possible to sort ascending.                                                                                                                                                                                                                     |
