Flutter Docs
  • Flutter Docs
  • Charts
    • Chart It
    • Guides
      • Cartesian Charts
        • Chart Structuring
          • Grid Styling
          • Axes Styling
          • Axis Labels
        • Charts
          • Bar Chart
            • BarSeries
            • Bar Groups
              • SimpleBar
              • MultiBar
            • Styling
            • Bar Interactions
              • Snap to Bar
              • Fuzziness
      • Radial Charts
        • Charts
          • Pie & Donut Chart
            • PieSeries
            • SliceData
            • Styling
            • Interactions
      • Animations
      • Interactions
    • API Documentation
Powered by GitBook
On this page
  1. Charts
  2. Guides
  3. Radial Charts
  4. Charts
  5. Pie & Donut Chart

SliceData

The data class that constructs the Pie Slices in a Pie/Donut Chart.

Jumping back to our previous example, we provided two SliceData to show a PieChart containing two slices.

SliceData defines the pie piece in a PieChart. It also provides the radius of the Pie and styling options should you choose to customize each individual pie slices.

Let's modify the original PieChart example, and represent every Pie with a Different Radius.

...
import 'package:chart_it/chart_it.dart';

class TestPieCharts extends StatefulWidget {
  const TestPieCharts({Key? key}) : super(key: key);

  @override
  State<TestPieCharts> createState() => _TestPieChartsState();
}

class _TestPieChartsState extends State<TestPieCharts> {
  @override
  Widget build(BuildContext context) {
    return PieChart(
      data: PieSeries(
        slices: <SliceData>[
          SliceData(
            label: (_, value) => 'Quarter 1',
            style: SliceDataStyle(
              color: Colors.pink,
              radius: 90,
            ),
            value: 18,
          ),
          SliceData(
            label: (_, value) => 'Quarter 2',
            style: SliceDataStyle(
              color: Colors.orange,
              radius: 130,
            ),
            value: 32,
          ),
          SliceData(
            label: (_, value) => 'Quarter 3',
            style: SliceDataStyle(
              color: Colors.cyanAccent,
              radius: 100,
            ),
            value: 48,
          ),
          SliceData(
            label: (_, value) => 'Quarter 4',
            style: SliceDataStyle(
              color: Colors.blueAccent,
              radius: 110,
            ),
            value: 76,
          ),
        ],
      ),
    );
  }
}

Even if you can provide custom radius for a pie slice, it won't exceed the max_radius limit which is calculated internally based on the Widget's Constraints.

Class Properties

Name
Type
Required
Default Value

value

num

true

-

style

SliceDataStyle?

false

null

label

SliceMapper?

false

null

labelStyle

ChartTextStyle?

false

null

PreviousPieSeriesNextStyling

Last updated 2 years ago