Android MPAndroidCharts 框架 画可滑动查看的直方图

来源:互联网 发布:小提琴音准软件 编辑:程序博客网 时间:2024/05/16 13:58

1.因为公司项目的需求,所以花了1.2天研究 MPAndroidCharts框架 。但是发现好多博客对我都没得帮助,浪费很多时间在百度上,不得不说google 真是比百度强太多了。

要求:统计出56个名族的数量

原创作者的github:https://github.com/PhilJay/MPAndroidChart   

MPAndroidCharts  API地址:https://jitpack.io/com/github/PhilJay/MPAndroidChart/v2.2.5/javadoc/


2.用到的框架是MPAndroidCharts。引入的依赖:

compile 'com.github.PhilJay:MPAndroidChart:v3.0.2' 
然后在引入仓库



3.正式开始使用

xml文件:

<?xml version="1.0" encoding="utf-8"?><RelativeLayout 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"    tools:context="aas.androidmpcharts.MainActivity">    <com.github.mikephil.charting.charts.BarChart        android:id="@+id/mBarChart"        android:layout_width="match_parent"        android:layout_height="300dp"        /></RelativeLayout>


MainActivity代码:

public class MainActivity extends AppCompatActivity {    BarChart mBarChart;    ArrayList<String> mlist=new ArrayList<String>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mBarChart = (BarChart) findViewById(R.id.mBarChart);        mBarChart.setDrawBarShadow(false);     //表不要阴影        mBarChart.setDrawValueAboveBar(true);        Description description=new Description();        description.setText("通行民族");        mBarChart.setDescription(description);  //表的描述信息        mBarChart.setPinchZoom(false);        mBarChart.setMaxVisibleValueCount(60); //最大显示的个数。超过60个将不再显示        mBarChart.setScaleEnabled(false);     //禁止缩放        mBarChart.setDragEnabled(true);// 是否可以拖拽        mBarChart.setHighlightPerDragEnabled(true);// 拖拽超过图标绘制画布时高亮显示        mBarChart.setDrawGridBackground(false);//      /*  mBarChart.setAutoScaleMinMaxEnabled(true);*/       /* mBarChart.animateX(500);//数据显示动画,从左往右依次显示*/       /* mBarChart.getAxisRight().setEnabled(false);*/        /*mBarChart.setDragDecelerationEnabled(true);*///拖拽滚动时,手放开是否会持续滚动,默认是true(false是拖到哪是哪,true拖拽之后还会有缓冲)        mBarChart.zoom(2.5f,1f,0,0);//显示的时候 是 按照多大的比率缩放显示   1f表示不放大缩小        //我默认手机屏幕上显示10  剩下的滑动直方图 然后显示。。假如要显示25个 那么除以10 就是放大2.5f。。同理        // 56个民族   那么放大5.6f        draw();    }    public void draw(){        //X轴 样式        final XAxis xAxis = mBarChart.getXAxis();        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);        xAxis.setLabelRotationAngle(90);//柱的下面描述文字  旋转90度        xAxis.setDrawLabels(true);        xAxis.setDrawGridLines(false);        xAxis.setTypeface(Typeface.createFromAsset(getAssets(), "OpenSans-Light.ttf"));//字体的相关的设置        xAxis.setGranularity(1f);//设置最小间隔,防止当放大时,出现重复标签。        xAxis.setCenterAxisLabels(true);//字体下面的标签 显示在每个直方图的中间        xAxis.setLabelCount(11,true);//一个界面显示10个Lable。那么这里要设置11个        xAxis.setTextSize(10f);        //Y轴样式        YAxis leftAxis = mBarChart.getAxisLeft();        leftAxis.setLabelCount(10);        leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);        leftAxis.setSpaceTop(15f);        leftAxis.setStartAtZero(false);        leftAxis.setYOffset(10f);        //这个替换setStartAtZero(true)        leftAxis.setAxisMaxValue(50f);        leftAxis.setAxisMinValue(0f);        leftAxis.setDrawGridLines(true);//背景线        leftAxis.setAxisLineColor(getResources().getColor(R.color.colorPrimaryDark));        //.设置比例图标的显示隐藏        Legend l = mBarChart.getLegend();        l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);        l.setOrientation(Legend.LegendOrientation.HORIZONTAL);        l.setDrawInside(false);        //样式        l.setForm(Legend.LegendForm.CIRCLE);        //字体        l.setFormSize(10f);        //大小        l.setTextSize(13f);        l.setFormToTextSpace(10f);        l.setXEntrySpace(10f);        //模拟数据        ArrayList<BarEntry> yVals1 = new ArrayList<BarEntry>();        yVals1.add(new BarEntry(1,23));        yVals1.add(new BarEntry(2, 20));        yVals1.add(new BarEntry(3, 30));        yVals1.add(new BarEntry(4, 10));        yVals1.add(new BarEntry(5, 45));        yVals1.add(new BarEntry(6, 50));        yVals1.add(new BarEntry(7, 35));        yVals1.add(new BarEntry(8, 26));        yVals1.add(new BarEntry(9, 14));        yVals1.add(new BarEntry(10, 20));        yVals1.add(new BarEntry(11, 33));        yVals1.add(new BarEntry(12, 44));        yVals1.add(new BarEntry(13, 42));        yVals1.add(new BarEntry(14, 41));        yVals1.add(new BarEntry(15, 12));        yVals1.add(new BarEntry(16, 31));        yVals1.add(new BarEntry(17, 21));        yVals1.add(new BarEntry(18, 20));        yVals1.add(new BarEntry(19, 44));        yVals1.add(new BarEntry(20, 42));        yVals1.add(new BarEntry(21, 41));        yVals1.add(new BarEntry(22, 12));        yVals1.add(new BarEntry(23, 31));        yVals1.add(new BarEntry(24, 21));        yVals1.add(new BarEntry(25, 20));        setData(yVals1);    }    private void setData(ArrayList yVals1) {        for(int i=1;i<=yVals1.size();i++) {            mlist.add(""+i);        }        IAxisValueFormatter ix=new MyXAxisValueFormatter(mlist);        mBarChart.getXAxis().setValueFormatter(ix);        BarDataSet set1;        if (mBarChart.getData() != null &&                mBarChart.getData().getDataSetCount() > 0) {            set1 = (BarDataSet) mBarChart.getData().getDataSetByIndex(0);            set1.setValues(yVals1);            mBarChart.getData().notifyDataChanged();            mBarChart.notifyDataSetChanged();        } else {            set1 = new BarDataSet(yVals1, "The year 2017");            set1.setColors(ColorTemplate.MATERIAL_COLORS);            ArrayList<IBarDataSet> dataSets = new ArrayList<IBarDataSet>();            dataSets.add(set1);            BarData data = new BarData(dataSets);            data.setValueTextSize(10f);            data.setBarWidth(1f);            mBarChart.setData(data);        }    }    public class MyXAxisValueFormatter implements IAxisValueFormatter {        private List<String> mValues;        public MyXAxisValueFormatter(List<String> values) {            this.mValues = values;        }        @Override        public String getFormattedValue(float value, AxisBase axis) {           int x=(int)(value);            if (x<0)                x=0;            if (x>=mValues.size())                x=mValues.size()-1;            return mValues.get(x);        }    }}

最后的结果:



在做的过程中遇到的几个坑说下::

1.xAxis.setAxisMaximum(500f); 设置x轴的最大轴。最开始我是这样设置的。。然后添加BarEntry的时候,随便填写x轴的坐标。但是最后发现有bug

妈的。 纠结了很久。 然后看原作者的demo ,发现作者并没有调用xAxis.setAxisMaximum(500f)。。每个直方图的坐标从1,开始往后数。记住一定要从1
开始。。从0开始会遇到问题。
2.如何给 每个直方图 下面添加标签:主要用到的是IAxisValueFormatter 重写
public String getFormattedValue(float value, AxisBase axis)通过这个value值 获取标签。。但是我debug发现 这个value并不是严格的1
,2,3,4,5 等等 这样按照顺序遍历的。所以这个方法 我不是很理解。看作者的代码也看不懂。坑

demo地址:http://download.csdn.net/detail/qq_25984015/9794208


0 0
原创粉丝点击