MPAndroidChart開源圖表庫(一)之餅狀圖

MPAndroidChart是一款基於Android的開源圖表庫,MPAndroidChart不僅可以在Android設備上繪製各種統計圖表,而且可以對圖表進行拖動和縮放操作,應用起來非常靈活。MPAndroidChart同樣擁有常用的圖表類型:線型圖、餅圖、柱狀圖和散點圖。

GitHub地址:

https://github.com/PhilJay/MPAndroidChart

下面主要實現以下餅狀圖:

1.從上面的地址中下載最新mpandroidchartlibrary-2-0-8.jar包, 然後copy到項目的libs中

  1. 定義xml文件

     <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    
    <com.github.mikephil.charting.charts.PieChart
        android:id="@+id/pie_chart"
        android:layout_width="match_parent"
        android:layout_height="320dip"
        android:layout_gravity="center_horizontal">
    
    </com.github.mikephil.charting.charts.PieChart>
    </LinearLayout>
    
  2. 主要Java邏輯代碼如下,註釋已經都添加上了。

  1. package com.jackie.mpandroidpiechart;    
    
    import java.util.ArrayList;    
    
    import com.github.mikephil.charting.charts.PieChart;    
    import com.github.mikephil.charting.components.Legend;    
    import com.github.mikephil.charting.components.Legend.LegendPosition;    
    import com.github.mikephil.charting.data.Entry;    
    import com.github.mikephil.charting.data.PieData;    
    import com.github.mikephil.charting.data.PieDataSet;    
    
    import android.support.v7.app.ActionBarActivity;    
    import android.graphics.Color;    
    import android.os.Bundle;    
    import android.util.DisplayMetrics;    
    
    public class MainActivity extends ActionBarActivity {    
    
    private PieChart mChart;    
    
    @Override    
    protected void onCreate(Bundle savedInstanceState) {    
        super.onCreate(savedInstanceState);    
        setContentView(R.layout.activity_main);    
    
        mChart = (PieChart) findViewById(R.id.spread_pie_chart);    
        PieData mPieData = getPieData(4, 100);    
        showChart(mChart, mPieData);    
    }    
    
    private void showChart(PieChart pieChart, PieData pieData) {    
        pieChart.setHoleColorTransparent(true);    
    
    pieChart.setHoleRadius(60f);  //半徑    
    pieChart.setTransparentCircleRadius(64f); // 半透明圈    
    //pieChart.setHoleRadius(0)  //實心圓    
    
    pieChart.setDescription("測試餅狀圖");    
    
    // mChart.setDrawYValues(true);    
    pieChart.setDrawCenterText(true);  //餅狀圖中間可以添加文字    
    
    pieChart.setDrawHoleEnabled(true);    
    
    pieChart.setRotationAngle(90); // 初始旋轉角度    
    
    // draws the corresponding description value into the slice    
    // mChart.setDrawXValues(true);    
    
    // enable rotation of the chart by touch    
    pieChart.setRotationEnabled(true); // 可以手動旋轉    
    
    // display percentage values    
    pieChart.setUsePercentValues(true);  //顯示成百分比    
    // mChart.setUnit(" €");    
    // mChart.setDrawUnitsInChart(true);    
    
    // add a selection listener    
    //      mChart.setOnChartValueSelectedListener(this);    
    // mChart.setTouchEnabled(false);    
    
    //      mChart.setOnAnimationListener(this);    
    
    pieChart.setCenterText("Quarterly Revenue");  //餅狀圖中間的文字    
    
    //設置數據    
    pieChart.setData(pieData);     
    
    // undo all highlights    
    //      pieChart.highlightValues(null);    
    //      pieChart.invalidate();    
    
    Legend mLegend = pieChart.getLegend();  //設置比例圖    
    mLegend.setPosition(LegendPosition.RIGHT_OF_CHART);  //最右邊顯示    
    
    mLegend.setXEntrySpace(7f);    
    mLegend.setYEntrySpace(5f);    
    
    pieChart.animateXY(1000, 1000);  //設置動畫    
    // mChart.spin(2000, 0, 360);    
     }    
    
        /**  
         *   
         * @param count 分成幾部分  
         * @param range  
         */    
    private PieData getPieData(int count, float range) {    
    
    ArrayList<String> xValues = new ArrayList<String>();  //xVals用來表示每個餅塊上的內容    
    
    for (int i = 0; i < count; i++) {    
        xValues.add("Quarterly" + (i + 1));  //餅塊上顯示成Quarterly1, Quarterly2, Quarterly3, Quarterly4    
    }    
    
    ArrayList<Entry> yValues = new ArrayList<Entry>();  //yVals用來表示封裝每個餅塊的實際數據    
    
    // 餅圖數據    
    /**  
     * 將一個餅形圖分成四部分, 四部分的數值比例爲14:14:34:38  
     * 所以 14代表的百分比就是14%   
     */    
    float quarterly1 = 14;    
    float quarterly2 = 14;    
    float quarterly3 = 34;    
    float quarterly4 = 38;    
    
    yValues.add(new Entry(quarterly1, 0));    
    yValues.add(new Entry(quarterly2, 1));    
    yValues.add(new Entry(quarterly3, 2));    
    yValues.add(new Entry(quarterly4, 3));    
    
    //y軸的集合    
    PieDataSet pieDataSet = new PieDataSet(yValues, "Quarterly Revenue 2014"/*顯示在比例圖上*/);    
    pieDataSet.setSliceSpace(0f); //設置個餅狀圖之間的距離    
    
    ArrayList<Integer> colors = new ArrayList<Integer>();    
    
    // 餅圖顏色    
    colors.add(Color.rgb(205, 205, 205));    
    colors.add(Color.rgb(114, 188, 223));    
    colors.add(Color.rgb(255, 123, 124));    
    colors.add(Color.rgb(57, 135, 200));    
    
    pieDataSet.setColors(colors);    
    
    DisplayMetrics metrics = getResources().getDisplayMetrics();    
    float px = 5 * (metrics.densityDpi / 160f);    
    pieDataSet.setSelectionShift(px); // 選中態多出的長度    
    
    PieData pieData = new PieData(xValues, pieDataSet);    
    
    return pieData;    
        }    
    }   
    

    效果圖如下:

主要是一些基本屬性和API的調用,具體每個API都有什麼樣的效果和作用,只能靠自己去嘗試。後面還會陸陸續續爲大家介紹MPAndroidChart其他類型的圖表。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章