apgapg / pie_chart

Flutter Pie chart with animation
https://pub.dev/packages/pie_chart
MIT License
179 stars 85 forks source link

Is it possible to have the center text without a background? #79

Open rivetingpeppermint opened 2 years ago

rivetingpeppermint commented 2 years ago

As shown in this image here

Screen Shot 2022-01-13 at 16 49 26

I have a ring chart, I've hidden all the legends but showed the center text. No matter what I do, the white background of this center text won't go away. Here's my code:

PieChart(
emptyColor: Colors.transparent,
key: ValueKey(1),
dataMap: <String, double>{
  "prc_1": 50,
  "prc2": 50,
},
animationDuration:
    Duration(milliseconds: 800),
chartRadius:
    MediaQuery.of(context).size.width /
                3.2 >
            300
        ? 300
        : MediaQuery.of(context)
                .size
                .width /
            3.2,
colorList: <Color>[
 Colors.blue,
  Colors.white
],
initialAngleInDegree: 270,
chartType: ChartType.ring,
centerText: 'Can we\nhave this\nwithout the\nwhite\nbackground',
centerTextStyle: TextStyle(
    fontFamily: 'Overpass'),
legendOptions: LegendOptions(
  showLegends: false,
),
chartValuesOptions: ChartValuesOptions(
  showChartValues: false,
),
ringStrokeWidth: 7.5),
apgapg commented 2 years ago

You can set chart value color to transparent

DeimeralGIT commented 2 years ago

Alternative solution By wrapping the pie inside a stack with a center alignment you can draw anything inside your pie chart