Pie

Pie charts split a whole into parts, to show each part's share of a total when there are only a few of them.

LLMs

Basic

A pie series with a radius of half the chart, a legend under it and a shadow on the hovered slice, with each label outside its slice.

Doughnut

Give radius an inner and outer value to draw a ring, and show the hovered slice's name in the middle through emphasis.label.

Rounded corners

Set itemStyle.borderRadius to round each slice of the ring, with a border in the card's color to separate them.

Gaps between slices

Set padAngle to open a gap between slices, with borderRadius rounding their ends.

Half doughnut

Set startAngle to 180 and endAngle to 360, and move center down, to draw the ring as a half circle.

Rose in area mode

A single roseType: "area" pie, where every slice has the same angle and its radius grows with the value.

Nightingale chart

Set roseType to radius or area to size each slice by its value, here the two modes side by side over the same categories.

Customized pie

A visualMap maps each value to colorLightness of one color, and animationType: "scale" grows the slices with an elastic ease.

Texture

Give each slice an itemStyle.decal of stripes, dots or squares so slices stay apart without relying on color alone.

Label alignment

Switch label.alignTo between none, labelLine and edge to line the outer labels up at the end of their lines or at the chart's edges.

Label line adjust

Three pies with labels aligned to the edge, where labelLayout moves each line's end point to the label's outer side.

Scrollable legend

Set legend.type to scroll to page through fifty names in a vertical legend beside the pie.

Rich text label

A label.rich table on one slice, with a shaded header row, a divider and weather icons drawn as backgroundColor images.

Nested pies

An inner pie of channels inside a ring of sources, whose labels use rich text for the series name, value and a percent badge.