可以画两层饼图吗？

Question

嗨，我正在尝试实现如下图表。请看图片，帮我找到一个合适的解决方案。这里我使用的是MPAndroidChart库。

现在我的饼图如下图所示。

我用的是下面的xml

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

在java中，我有这样的管理角度。

mChart.setMaxAngle(270f); // HALF CHART
mChart.setRotationAngle(135f);

我仍然无法创建饼图的内线。我想要上面已经提到的图表。我该怎么画这条线呢？

Answer 1

首先，需要在项目中添加MPAndroidChart库。这是我写的基本代码，您需要根据自己的使用进行更改。

主要活动。JAVA

package com.devdwl.stackdemo;

import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.github.mikephil.charting.charts.PieChart;
import com.github.mikephil.charting.data.PieData;
import com.github.mikephil.charting.data.PieDataSet;
import com.github.mikephil.charting.data.PieEntry;
import com.github.mikephil.charting.formatter.PercentFormatter;
import com.github.mikephil.charting.utils.ColorTemplate;
import com.github.mikephil.charting.utils.MPPointF;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    PieChart mChartOuter, mChartInner;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        mChartOuter = (PieChart) findViewById(R.id.mChartOuter);
        mChartInner = (PieChart) findViewById(R.id.mChartInner);

        mChartOuter.getDescription().setEnabled(false);
        mChartInner.getDescription().setEnabled(false);


        mChartOuter.setCenterTextSize(10f);
        mChartInner.setCenterTextSize(10f);

        mChartOuter.setHoleRadius(75f);
        mChartInner.setHoleRadius(75f);

        mChartOuter.setTransparentCircleRadius(50f);
        mChartInner.setTransparentCircleRadius(50f);

        mChartOuter.getLegend().setEnabled(false);
        mChartInner.getLegend().setEnabled(false);

        setData();

    }

    private void setData() {

        ArrayList<PieEntry> entries = new ArrayList<PieEntry>();

        for (int i = 0; i < 5; i++) {
            entries.add(new PieEntry((float) ((Math.random() * (float) 5) + (float) 5 / 5), i));
        }

        PieDataSet dataSet = new PieDataSet(entries, "Election Results");

        dataSet.setDrawIcons(false);

        dataSet.setSliceSpace(3f);
        dataSet.setIconsOffset(new MPPointF(0, 40));
        dataSet.setSelectionShift(5f);

        ArrayList<Integer> colors = new ArrayList<Integer>();

        for (int c : ColorTemplate.VORDIPLOM_COLORS)
            colors.add(c);

        for (int c : ColorTemplate.JOYFUL_COLORS)
            colors.add(c);

        for (int c : ColorTemplate.COLORFUL_COLORS)
            colors.add(c);

        for (int c : ColorTemplate.LIBERTY_COLORS)
            colors.add(c);

        for (int c : ColorTemplate.PASTEL_COLORS)
            colors.add(c);

        colors.add(ColorTemplate.getHoloBlue());

        dataSet.setColors(colors);

        PieData data = new PieData(dataSet);
        data.setValueFormatter(new PercentFormatter());
        data.setValueTextSize(11f);
        data.setValueTextColor(Color.WHITE);
        mChartOuter.setData(data);
        mChartInner.setData(data);

        mChartOuter.highlightValues(null);
        mChartInner.highlightValues(null);

        mChartOuter.invalidate();
        mChartInner.invalidate();
    }

}

主要活动。xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/constraint_holder"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <com.github.mikephil.charting.charts.PieChart
        android:id="@+id/mChartOuter"
        android:layout_width="600dp"
        android:layout_height="600dp"
        android:layout_centerInParent="true" />


    <com.github.mikephil.charting.charts.PieChart
        android:id="@+id/mChartInner"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerInParent="true" />

</RelativeLayout>

结果

祝你好运。