MPAndroidChart之PieChart

最新推荐文章于 2024-05-01 16:12:26 发布

KdanMin

最新推荐文章于 2024-05-01 16:12:26 发布

阅读量1.9k

点赞数

分类专栏：【Android进阶之旅系列】【Android自定义View系列】文章标签：插件

本文链接：https://blog.csdn.net/qq_15950325/article/details/52954697

版权

【Android自定义View系列】同时被 2 个专栏收录

9 篇文章 0 订阅

订阅专栏

【Android进阶之旅系列】

6 篇文章 3 订阅

订阅专栏

MPAndroidChart简介

简介：一个可以拖动缩放的图表库，包含曲线图、直方图、饼状图，其中直方图支持3d效果。
下面废话不多说，今天讲的是饼状图比较简单！老规矩直接上效果图！
这里写图片描述
主要步骤如下

前期准备工作
因为这里用到第三方的插件所以需要下载mpandroidchartlibrary-2-1-6.jar包，这里需要的自行到github上面下载
然后在libs 中右键path —–>add to path即可使用
首先是创建一个布局文件如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <com.github.mikephil.charting.charts.PieChart
        android:id="@+id/piechart"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        />
</LinearLayout>

然后创建一个PieChartActivity类首先进行初始化UI操作

private void initView() {
        // 初始化UI组件
        //ButterKnife.bind(PieChartActivity.this);
        mPieChart= (PieChart) findViewById(R.id.piechart);
        mPieData=getPieData(4,100);
        showPieChart(mPieChart,mPieData);


    }

显示饼状图代码如下

/**
     * 显示饼状图表
     * @param pieChart
     * @param PieData
     */
    private void showPieChart(PieChart pieChart, PieData PieData) {
        pieChart.setHoleColorTransparent(true);
        //设置半透明圈效果
        pieChart.setHoleRadius(64f);
        //pieChart.setHoleRadius(0);
        pieChart.setDescription("卓越加工中心分布图");
        pieChart.setDrawCenterText(true);
        //饼状图可以添加文字
        pieChart.setDrawHoleEnabled(true);
        //设置起始角度
        pieChart.setRotationAngle(90f);
        pieChart.setRotationEnabled(true);//设置可以手动旋转
        pieChart.setUsePercentValues(true);//显示成百分比
        pieChart.setCenterText("卓越信息2016年业绩图");
        //设置字体大小
        pieChart.setCenterTextSize(28);
        //设置字体类型
        pieChart.setCenterTextTypeface(Typeface.create(Typeface.SANS_SERIF, Typeface.ITALIC));
        //将数据添加到PieData中
        pieChart.setData(mPieData);
        //设置高光效果
        pieChart.needsHighlight(20, 100);
        //mPieChart.setTouchEnabled(false);

        mPieChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {

            @Override
            public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
                // TODO Auto-generated method stub
                Log.i(TAG, "dataSetIndex:"+dataSetIndex);
            }

            @Override
            public void onNothingSelected() {
                // TODO Auto-generated method stub

            }
        });
        Legend mLegend=pieChart.getLegend();
        mLegend.setPosition(LegendPosition.RIGHT_OF_CHART_CENTER);//中心顯示
        //mLegend.setPosition(LegendPosition.RIGHT_OF_CHART);//最右邊顯示
        mLegend.setForm(LegendForm.SQUARE);//Line线性 square
        mLegend.setXEntrySpace(7f);
        mLegend.setYEntrySpace(5f);
        pieChart.animateXY(1200, 1200);//设置动画时间
        //mPieChart.spin(2000, 0, 360,0);
    }

获取饼状图的数据主要通过遍历饼状图，然后将它分成四块，另外每块显示按16%，16%，32%,36%显示，然后添加x轴，y轴的数据，最后通过设置rgb颜色值进行填充效果，以及设置动画开始结束的时间。



    private PieData getPieData(int count, float range) {
        // 遍历饼状图
        List<String> mXList=new ArrayList<String>();
        for (int i = 0; i < count; i++) {
            mXList.add("业绩所占比例:"+(i+1));//饼块上显示成业绩比例1 显示成业绩比例2 显示成业绩比例3 显示成业绩比例4


        }
        ArrayList<Entry> mYArrayList=new ArrayList<Entry>();
        /** 
         * 将一个饼形图分成四部分， 四部分的数值比例为16:16:32:36
         * 所以 16代表的百分比就是16%  
         */  
        float quarterly_one = 16;
        float quarterly_two = 16;
        float quarterly_three = 32;
        float quarterly_four = 36;

        mYArrayList.add(new Entry(quarterly_one, 0));
        mYArrayList.add(new Entry(quarterly_two, 1));
        mYArrayList.add(new Entry(quarterly_three, 2));
        mYArrayList.add(new Entry(quarterly_four, 3));

        //y轴集合
        PieDataSet mPieDataSet=new PieDataSet(mYArrayList, "2016/*显示业绩比例图*/");
        mPieDataSet.setSliceSpace(0f);//设置饼状之间的间隙
        ArrayList<Integer> mColorIntegers=new ArrayList<Integer>();
        //饼状的颜色
        mColorIntegers.add(Color.rgb(215, 215,215));
        mColorIntegers.add(Color.rgb(117, 18,223));
        mColorIntegers.add(Color.rgb(255, 115,125));
        mColorIntegers.add(Color.rgb(59, 138,205));
        //设置颜色集
        mPieDataSet.setColors(mColorIntegers);

        DisplayMetrics dm=getResources().getDisplayMetrics();
        float px=5*(dm.densityDpi/160f);
        mPieDataSet.setSelectionShift(px);
        PieData pieData=new PieData(mXList,mPieDataSet);

        return pieData;




    }

最后贴上完整代码

public class PieChartActivity extends Activity {

    private static final String TAG="PieChartActivity";
    private PieChart mPieChart;
    PieData mPieData;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_barchart);
        initView();


    }
    /**
     * 显示饼状图表
     * @param pieChart
     * @param PieData
     */
    private void showPieChart(PieChart pieChart, PieData PieData) {
        pieChart.setHoleColorTransparent(true);
        //设置半透明圈效果
        pieChart.setHoleRadius(64f);
        //pieChart.setHoleRadius(0);
        pieChart.setDescription("卓越加工中心分布图");
        pieChart.setDrawCenterText(true);
        //饼状图可以添加文字
        pieChart.setDrawHoleEnabled(true);
        //设置起始角度
        pieChart.setRotationAngle(90f);
        pieChart.setRotationEnabled(true);//设置可以手动旋转
        pieChart.setUsePercentValues(true);//显示成百分比
        pieChart.setCenterText("卓越信息2016年业绩图");
        //设置字体大小
        pieChart.setCenterTextSize(28);
        //设置字体类型
        pieChart.setCenterTextTypeface(Typeface.create(Typeface.SANS_SERIF, Typeface.ITALIC));
        //将数据添加到PieData中
        pieChart.setData(mPieData);
        //设置高光效果
        pieChart.needsHighlight(20, 100);
        //mPieChart.setTouchEnabled(false);

        mPieChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {

            @Override
            public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
                // TODO Auto-generated method stub
                Log.i(TAG, "dataSetIndex:"+dataSetIndex);
            }

            @Override
            public void onNothingSelected() {
                // TODO Auto-generated method stub

            }
        });
        Legend mLegend=pieChart.getLegend();
        mLegend.setPosition(LegendPosition.RIGHT_OF_CHART_CENTER);//中心顯示
        //mLegend.setPosition(LegendPosition.RIGHT_OF_CHART);//最右邊顯示
        mLegend.setForm(LegendForm.SQUARE);//Line线性 square
        mLegend.setXEntrySpace(7f);
        mLegend.setYEntrySpace(5f);
        pieChart.animateXY(1200, 1200);//设置动画时间
        //mPieChart.spin(2000, 0, 360,0);


    }
    private void initView() {
        // 初始化UI组件
        //ButterKnife.bind(PieChartActivity.this);
        mPieChart= (PieChart) findViewById(R.id.piechart);
        mPieData=getPieData(4,100);
        showPieChart(mPieChart,mPieData);


    }
    private PieData getPieData(int count, float range) {
        // 遍历饼状图
        List<String> mXList=new ArrayList<String>();
        for (int i = 0; i < count; i++) {
            mXList.add("业绩所占比例:"+(i+1));//饼块上显示成业绩比例1 显示成业绩比例2 显示成业绩比例3 显示成业绩比例4


        }
        ArrayList<Entry> mYArrayList=new ArrayList<Entry>();
        /** 
         * 将一个饼形图分成四部分， 四部分的数值比例为16:16:32:36
         * 所以 16代表的百分比就是16%  
         */  
        float quarterly_one = 16;
        float quarterly_two = 16;
        float quarterly_three = 32;
        float quarterly_four = 36;

        mYArrayList.add(new Entry(quarterly_one, 0));
        mYArrayList.add(new Entry(quarterly_two, 1));
        mYArrayList.add(new Entry(quarterly_three, 2));
        mYArrayList.add(new Entry(quarterly_four, 3));

        //y轴集合
        PieDataSet mPieDataSet=new PieDataSet(mYArrayList, "2016/*显示业绩比例图*/");
        mPieDataSet.setSliceSpace(0f);//设置饼状之间的间隙
        ArrayList<Integer> mColorIntegers=new ArrayList<Integer>();
        //饼状的颜色
        mColorIntegers.add(Color.rgb(215, 215,215));
        mColorIntegers.add(Color.rgb(117, 18,223));
        mColorIntegers.add(Color.rgb(255, 115,125));
        mColorIntegers.add(Color.rgb(59, 138,205));
        //设置颜色集
        mPieDataSet.setColors(mColorIntegers);

        DisplayMetrics dm=getResources().getDisplayMetrics();
        float px=5*(dm.densityDpi/160f);
        mPieDataSet.setSelectionShift(px);
        PieData pieData=new PieData(mXList,mPieDataSet);

        return pieData;




    }

}

到这里基本结束了！效果一般！很多需要改进，麻烦大家多提意见！谢谢也可以加群讨论！扫码直接进入！
这里写图片描述

KdanMin

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
MPAndroidChart之PieChart

MPAndroidChart简介简介：一个可以拖动缩放的图表库，包含曲线图、直方图、饼状图，其中直方图支持3d效果。下面废话不多说，j今天讲的是饼状图比较简单！老规矩直接上效果图！主要步骤如下前期准备工作因为这里用到第三方的插件所以需要下载mpandroidchartlibrary-2-1-6.jar包，这里需要的自行到github上面下载然后在path —–>a
复制链接

扫一扫

专栏目录