Pie chart values overlap and get clipped MPAndroidChart

Question

I am using the MPAndroidChart library to draw a pie chart in my app but if a value gets a little bit bigger than others all the other values and their labels get overlapped. I am also having some problems with labels in which some text gets clipped if it is a bit longer. I have seen apps(examples are given below) that adjust the size of the pie chart dynamically if they are provided with the same data scenario as I am having.

<com.github.mikephil.charting.charts.PieChart
android:id="@+id/main_dashboard_pie_chart"
android:layout_width="match_parent"
android:layout_height="400dp">

My Java code

pieDataSet.setColors(colors);
pieDataSet.setYValuePosition(PieDataSet.ValuePosition.OUTSIDE_SLICE);
pieDataSet.setXValuePosition(PieDataSet.ValuePosition.OUTSIDE_SLICE);
pieDataSet.setValueTextColor(Color.BLACK);
pieDataSet.setSliceSpace(2);
pieDataSet.setValueLinePart1OffsetPercentage(10); //starting of the line from center of the chart offset
pieDataSet.setValueLinePart1Length(0.6f);
pieDataSet.setValueLinePart2Length(0.5f);

PieData pieData = new PieData(pieDataSet);
pieData.setValueTextSize(13);
pieData.setValueFormatter(new PercentFormatter());

pieChart.setUsePercentValues(true);
pieChart.setData(pieData);
pieChart.setTransparentCircleRadius(45);
pieChart.setHoleRadius(40);
pieChart.setUsePercentValues(true);
pieChart.setCenterText("Expenses");
pieChart.setEntryLabelTextSize(10);
pieChart.animateY(1000, Easing.EasingOption.EaseInOutCubic);
pieChart.getDescription().setEnabled(false);
pieChart.setEntryLabelColor(Color.BLACK);
pieChart.setEntryLabelTextSize(13);
pieChart.setExtraBottomOffset(50f);
pieChart.setExtraTopOffset(50f);
pieChart.setExtraLeftOffset(50f);
pieChart.setExtraRightOffset(50f);
Legend l = pieChart.getLegend();
l.setDrawInside(false);
l.setEnabled(false);

I have explained it below if you still face any problems do let me know. — Asghar Nazir

Asghar Nazir Asghar Nazir · Accepted Answer · 2020-04-04T08:43:16

Use This Library to solve the problem https://github.com/huzipiaopiao/MPAndroidChartFix

in XML Define your chart as shown below.

  <com.teaanddogdog.mpandroidchartutil.PieChartFixCover
            android:id="@+id/pie_chart"
            android:layout_width="450dp"
            android:layout_height="450dp"
            app:mp_chart_out_value_place_mode="AVG"
            app:mp_chart_auto_adapt_text_size="true"
            />

And you can access it in java code just as you access MPANdroidChart and can modify all the properties. Don't forget to upvote the question and answer if it helps you. All of the overlapping problems will be handled for you automatically. Thank you.

Pie chart values overlap and get clipped MPAndroidChart

1 Answers