Mermaid Pie Chart Cheat Sheet

A labelled list of values, drawn as slices.

Every picture on this page was drawn byMernyx, the native Mermaid editor for macOS. Not by a browser running Mermaid.js — the same renderer the app uses for its canvas.

The basic form

One slice per line: a quoted label, a colon, and a positive number. Zero or a negative value fails the diagram.

pie
  "Dogs" : 386
  "Cats" : 85
  "Rats" : 15

A pie chart with three slices labelled Dogs, Cats and Rats, the largest by far.

Adding a title

The title goes on the same line as the pie keyword.

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

The same pie chart with the title Pets adopted by volunteers above it.

Showing the numbers

showData prints the value next to each label in the legend.

pie showData
  title Market share
  "Product A" : 45
  "Product B" : 26
  "Product C" : 29

A pie chart whose legend shows the numbers 45, 26 and 29 beside the three product names.

Draw it in Mernyx.

Open a .mmd file, move a node on the canvas, and the source comes with it. Native on macOS, no browser involved.

Buy Mernyx Pro — $19 Download free