1. 程式人生 > >Android統計圖的繪製( MPChartLib 的使用)

Android統計圖的繪製( MPChartLib 的使用)

最近一直在研究Android 圖形塊的內容,繪製統計圖肯定是要去學的;在自己寫之前,首先要借鑑下別人寫的;先學學別人的;我把對MPChartLib 的使用總結一下;

先上效果圖
這裡寫圖片描述

統計圖我們大可以從2點來思考:

a、座標軸

b、資料

現在來分別看一下

1、柱形統計圖

返回 條形統計圖需要展示的資料;這個可以自己選擇;

 /**
     *
     * @return 折線統計圖的資料
     */
    public  LineData getLineData( ){
        // 股票資料
        Stock mStock= AssetsManger.readAssertToObject("json/fenshidata.json"
, Stock.class,this); ArrayList<Entry>mEntry=new ArrayList<>(); for(int i=0;i<mStock.getData().size();i++){ Stock.DataBean dataBean=mStock.getData().get(i); Entry entry=new Entry(i, (float) dataBean.getNow()); mEntry.add(i,entry); } LineDataSet mLineDataSet=new
LineDataSet(mEntry,mStock.getName()); mLineDataSet.setLineWidth(1); mLineDataSet.setDrawCircleHole(false); mLineDataSet.setDrawCircles(false); mLineDataSet.setDrawFilled(false); mLineDataSet.setDrawValues(true); mLineDataSet.setDrawHighlightIndicators(false
); mLineDataSet.setColors(ColorTemplate.VORDIPLOM_COLORS); LineData mLineData=new LineData(); mLineData.addDataSet(mLineDataSet); return mLineData; }

在view 中顯示 有資料的條形統計圖 ,在這裡所有統計圖的顯示都採用以下方法;在這裡 第一個引數 是:
BarLineChartBase lineChartBase: BarLineChartBase是barchart、linechart、candle chart。。的父類,也就是說你可以傳入 條形統計圖barchart,燭形統計圖:candle chart…..
第二引數:要和你傳入的顯示圖對應;BarLineScatterCandleBubbleData data ,也就是說,條形統計圖就放條行統計圖的資料

    /**
     *   
     * @param lineChartBase   barchart、linechart、candle chart。。的父類
     * @param data     線性表的 資料
     */
    public void showChart(BarLineChartBase lineChartBase, BarLineScatterCandleBubbleData data){
        mContainer.removeAllViews();
        mContainer.addView(lineChartBase);
        FrameLayout.LayoutParams params=new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
         ViewGroup.LayoutParams.MATCH_PARENT);
        lineChartBase.setLayoutParams(params);


        lineChartBase.setData(data);
        lineChartBase.setDoubleTapToZoomEnabled(false);
        lineChartBase.setBackgroundColor(Color.argb(12,12,22,22));
       //橫座標
        XAxis xAxis= lineChartBase.getXAxis();
        xAxis.setDrawAxisLine(false);
        xAxis.setCenterAxisLabels(false);
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);

        xAxis.setValueFormatter(new AxisValueFormatter() {
            @Override
            public String getFormattedValue(float value, AxisBase axis) {

                return value+"";
            }

            @Override
            public int getDecimalDigits() {
                return 0;
            }
        });

        xAxis.setDrawAxisLine(false);
        xAxis.setDrawGridLines(false);
        xAxis.setDrawLabels(false);
        //左縱座標
        YAxis yAxisL=lineChartBase.getAxisLeft();
       yAxisL.setDrawAxisLine(false);
        yAxisL.setDrawGridLines(false);
        //右縱座標
        YAxis yAxisR=lineChartBase.getAxisRight();
        yAxisR.setDrawGridLines(false);



        lineChartBase.setGridBackgroundColor(Color.argb(12,123,12,33));
        lineChartBase.setDrawGridBackground(true);
        lineChartBase.animateX(2500);
    }

顯示在檢視中:

BarChart mChart=new BarChart(this);
showChart(mChart,getBarData());

2、折線統計圖

資料:

     /**
     *
     * @return 折線統計圖的資料
     */
    public  LineData getLineData( ){
        // 股票資料
        Stock mStock= AssetsManger.readAssertToObject("json/fenshidata.json", Stock.class,this);
        ArrayList<Entry>mEntry=new ArrayList<>();
        for(int i=0;i<mStock.getData().size();i++){
            Stock.DataBean dataBean=mStock.getData().get(i);
            Entry entry=new Entry(i, (float) dataBean.getNow());
            mEntry.add(i,entry);
        }
        LineDataSet mLineDataSet=new LineDataSet(mEntry,mStock.getName());
        mLineDataSet.setLineWidth(1);
        mLineDataSet.setDrawCircleHole(false);
        mLineDataSet.setDrawCircles(false);
        mLineDataSet.setDrawFilled(false);
        mLineDataSet.setDrawValues(true);
        mLineDataSet.setDrawHighlightIndicators(false);

         mLineDataSet.setColors(ColorTemplate.VORDIPLOM_COLORS);
        LineData mLineData=new LineData();
        mLineData.addDataSet(mLineDataSet);
        return  mLineData;

    }

顯示:

 mChart=new LineChart(this);
 showChart(mChart,getLineData());

3、燭形統計圖

資料

/**
     * 返回燭形圖 資料
     * @return
     */
    public CandleData getCandleData(){
        // 股票資料
        CandleStock mStock=AssetsManger.
                readAssertToObject("json/marketcandle.json", CandleStock.class,this);
        ArrayList<CandleEntry> candleEntrys=new ArrayList<>();
        for (int i=0;i<mStock.getData().size();i++){

            CandleStock.DataBean databean=mStock.getData().get(i);

            CandleEntry entry=new CandleEntry(i,
                    (float) databean.getHigh(),
                    (float)databean.getLow(),
                    (float)databean.getOpen(),
                    (float)databean.getNow());
             candleEntrys.add(entry);

        }

        ArrayList<CandleEntry> yVals1 = new ArrayList<CandleEntry>();

        for (int i = 0; i < 20; i++) {
            //float mult = (mSeekBarY.get + 1);
          float val = (float) (Math.random() * 40) + 20;

          float high = (float) (Math.random() * 9) + 8f;
          float low = (float) (Math.random() * 9) + 8f;

         float open = (float) (Math.random() * 6) + 1f;
        float close = (float) (Math.random() * 6) + 1f;

          boolean even = i % 2 == 0;

            yVals1.add(new CandleEntry(i, val + high, val - low, even ? val + open : val - open,
                    even ? val - close : val + close));
        }



        CandleDataSet candledataset=new   CandleDataSet(yVals1,mStock.getName());     candledataset.setAxisDependency(YAxis.AxisDependency.LEFT);

        candledataset.setBarSpace(1f);
        candledataset.setDecreasingColor(Color.BLUE);
        candledataset.setShadowWidth(12f);
        candledataset.setShowCandleBar(true);

        candledataset.setAxisDependency(YAxis.AxisDependency.LEFT);
       //candledataset.setShadowColor(Color.BLACK);
        candledataset.setShadowColorSameAsCandle(true);
        candledataset.setShadowWidth(0.7f);
        candledataset.setDecreasingColor(Color.GREEN);
        candledataset.setDecreasingPaintStyle(Paint.Style.FILL);
        candledataset.setIncreasingColor(Color.RED);
        candledataset.setIncreasingPaintStyle(Paint.Style.FILL);


        candledataset.setColors(ColorTemplate.LIBERTY_COLORS);


        CandleData candleData=new CandleData();
        candleData.addDataSet(candledataset);

        return  candleData;


    }

顯示

CandleStickChart mChart=new CandleStickChart(this);
  showChart(mChart,getCandleData());

4、組合統計圖

資料

/**
     * 返回組合圖 資料
     */
    public CombinedData getCombinedData(){

        CombinedData data=new CombinedData();
        data.setData(getCandleData());
        data.setData(getLineData());
        data.setData(getBarData());
        return data;
    }

顯示

CombinedChart mChart=new CombinedChart(this);
 showChart(mChart,getCombinedData());

總結

MPChartLib的使用很簡單,主要是寫這個庫的思想,將資料、顯示、徹底的分開,兩者互不影響,同時整體我感覺過於龐大繁瑣,如果直接拿來用放到自己的app中,免不了有些浪費空間;如果自己需要的話,還是在這個上面抽出自己有用的就好了,其他都可以捨棄掉;
對我來說,學到不少,往後我要努力嘗試自己寫一個;