Plug n Play Pie Chart in Flutter

CustomPieChart Widget Documentation

The CustomPieChart widget is a ready-to-use Flutter Pie Chart solution for interactive data visualization. It allows you to display data dynamically with minimal setup and offers customization options to suit your design needs.

Features

• Displays data interactively with a Pie Chart.


• Automatically assigns unique colors to data values.


• Includes an optional legend box to map colors to labels.


• Highly customizable parameters for styling and layout.

CustomPieChart Parameters

Required

• data
  Type: List<Map<String, dynamic>>
  A list of key-value pairs representing the data to display.
  Example:

[

{'Label1': 40},

{'Label2': 60}

]

Optional

1. chartTitle
   Type: String?
   Displays a title at the center of the pie chart.
   Default: null (no title).


2. startDegreeOffset
   Type: double
   Sets the starting degree of the chart.
   Default: 250.


3. sectionsSpace
   Type: double
   Controls the spacing between sections of the chart.
   Default: 0.


4. centerSpaceRadius
   Type: double
   Adjusts the radius of the space at the center of the chart.
   Default: 100.


5. barRadius
   Type: double
   Changes the thickness of the chart's sections.
   Default: 25.


6. chartTitleSize
   Type: double
   Controls the font size of the chart title.
   Default: 20.


7. showTitle
   Type: bool
   If true, displays labels for each section above the pie chart.
   Default: false.

Usage Example

CustomPieChart(

data: [

{'Hello': 50},

{'Bye': 50}

],

chartTitle: 'Testing',

showTitle: true,

startDegreeOffset: 250,

barRadius: 25,

)

Legend Widget Documentation

The Legend widget is an optional component that displays a legend box below the pie chart. It maps each color to its corresponding label for better data comprehension.

Legend Parameters

Required

• data
  Type: List<Map<String, dynamic>>
  Same as the data parameter in CustomPieChart.

Optional

1. legendTitle
   Type: String
   Sets the title of the legend box.
   Default: "Legend".


2. legendBoxRadius
   Type: double
   Adjusts the border radius of the legend box container.
   Default: 16.


3. legendBoxColor
   Type: Color
   Controls the background color of the legend box.
   Default: Color.fromARGB(75, 200, 200, 201).


4. width
   Type: double?
   Sets the width of the small color squares next to labels.
   Default: 16.


5. height
   Type: double?
   Sets the height of the small color squares next to labels.
   Default: 16.


6. colorRadius
   Type: double?
   Adjusts the border radius of the small color squares.
   Default: 0 (normal squares).

Usage Example

Legend(

data: [

{'Hello': 50},

{'Bye': 50}

],

legendTitle: 'My Legend',

colorRadius: 5,

legendBoxColor: Colors.grey[200]!,

)

Key Benefits

• Minimal setup with data as the only required parameter.


• Flexible styling for both the pie chart and the legend box.


• Simplifies the process of creating interactive, visually appealing dashboards.

Feel free to implement and customize it for your project!