> For the complete documentation index, see [llms.txt](https://docs.paradime.io/app-help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.paradime.io/app-help/integrations/mermaid-js/pie-chart-diagrams.md).

# Pie Chart Diagrams

### What are Mermaid Pie Charts?

Mermaid's pie charts visualize proportional data by dividing a circle into slices, where each slice represents a percentage of the whole. For data teams, they're useful for showing distributions, composition breakdowns, and relative proportions in your data.

***

### Creating Your First Pie Chart

1. **Launch DinoAI:** From Code IDE, access [DinoAI](/app-help/documentation/dino-ai.md) to start creating diagrams.
2. **Use a Simple Prompt:** Tell DinoAI what kind of Pie Chart you want to create. For example:

{% code overflow="wrap" %}

```
- "Create a mermaid pie chart showing the distribution of data sources in my warehouse"
"Generate a mermaid pie chart for my data quality metrics with clean vs. problematic records"
"Build a mermaid pie chart showing resource allocation across different data pipeline components"
```

{% endcode %}

3. **Get Your Diagram:** DinoAI will generate a complete `.mmd` file with proper Mermaid syntax.
4. **Preview Your Work:** Click the eye icon (👁️) to preview your diagram in real-time as you edit.
5. **Iterate and Refine:** Modify the generated `.mmd` file directly, or ask DinoAI to make specific changes.

#### Example:

```mermaid
pie title Pets adopted by volunteers
    "Dogs" : 386
    "Cats" : 85
    "Rats" : 15
```

<figure><img src="/files/WuB0zMVaIzO5GMKCsWRZ" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
**Reusable Pie Chart prompts for you and your team**

You can create custom, standardized [.dinoprompts](/app-help/documentation/dino-ai/dino-prompts.md) for Mermaid's Pie Chart Diagrams that ensure consistency across your data team. See [step-by-step guide.](https://docs.paradime.io/app-help/integrations/mermaid-js/pages/ljlILu3iM7h23T4Pomrb#creating-mermaid-diagrams-with-.dinoprompts)
{% endhint %}

***

### Diagram Syntax Guide

#### Basic Structure

```mermaid
pie
    title Chart Title
    "Label 1" : 50
    "Label 2" : 30
    "Label 3" : 20
```

#### Optional Features

* Add `showData` after `pie` to display values
* Title is optional
* Values support up to 2 decimal places

### Data Team Examples

#### Data Quality Metrics

```mermaid
pie title Data Quality Overview
    "Clean Records" : 85.5
    "Missing Values" : 10.25
    "Anomalies" : 4.25
```

#### Resource Allocation

```mermaid
pie showData title CPU Usage by Process
    "ETL Jobs" : 45.5
    "Queries" : 30.2
    "Analytics" : 15.8
    "Other" : 8.5
```

### Configuration Options

#### Label Position

```mermaid
%%{init: {"pie": {"textPosition": 0.5}} }%%
pie
    "A" : 50
    "B" : 50
```

* `textPosition`: 0.0 (center) to 1.0 (edge)
* Default: 0.75

#### Visual Customization

```mermaid
%%{init: {"themeVariables": {"pieOuterStrokeWidth": "5px"}} }%%
pie
    "Group A" : 50
    "Group B" : 50
```

### Best Practices

1. Limit to 6-8 slices for readability
2. Order slices by size (largest first)
3. Use clear, concise labels
4. Consider using `showData` for precise values
5. Use meaningful titles

***

{% hint style="info" %}

#### Additional Resources

For more syntax options and configuration parameters, visit the [official Mermaid documentation](https://mermaid.js.org/syntax/pie.html)
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.paradime.io/app-help/integrations/mermaid-js/pie-chart-diagrams.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.