最牛逼Android图表库--MPChart(Piechart显示数据带%号 的问题)

其实使用这个库好久了,网上也有各路大神的博客,参考了很多。但是感觉还是有些属性没有涉及到,没有达到高度自定义效果,于是自己亲自实践总结了一下。(如有雷同之处,没错,那就是我借鉴的-尴尬.png)

一、如何在项目中集成MPChart

项目中集成MpChart有两种方式(各有利弊):

1.添加依赖

在Project即工程下的build.gradle文件里添加
maven { url "https://jitpack.io" }
添加下来是这个样子的:
allprojects {
  repositories {
      jcenter()
      maven { url "https://jitpack.io" }
      google()
  }
}
然后在项目下的build.gradle文件里添加
compile 'com.github.PhilJay:MPAndroidChart:v3.0.1'

是的,第一种方法就是这么简单

2.导入library

gitHub上的库请移步

https://github.com/PhilJay/MPAndroidChart
下载下来工程,然后导入如图2的MPChartLib

导入1.png

导入2.png

导入完成之后再添加项目依赖
导入3.png

到此,第二种方式也介绍完了

然后简单介绍一下这两种方式的利弊:第一种方式不用导入library,可以减小你的项目大小,引用起来也非常方便。但是,这种方法我们无法修改库里的文件,有些不合适我们的属性我们也不能加以调整,有些地方就受限了(亲身体会)。 第二种方式相比就会增加项目的大小。BUT,你可以在你需要的情况下修改library的一些文件,以达到我们想要的效果。

二、如何使用

1.PieChart(饼形图)

这个库使用起来还是非常简单方便的,和普通的控件使用方式是一样的接下来以PieChart为例在布局文件中添加

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

在Activity中

-->设置各区块的颜色
public static final int[] PIE_COLORS = {
        Color.rgb(181, 194, 202), Color.rgb(129, 216, 200), Color.rgb(241, 214, 145),
        Color.rgb(108, 176, 223), Color.rgb(195, 221, 155), Color.rgb(251, 215, 191),
        Color.rgb(237, 189, 189), Color.rgb(172, 217, 243)
};

-->模拟数据
HashMap dataMap = new HashMap();
    dataMap.put("A","300");
    dataMap.put("B","600");
    dataMap.put("C","500");
    dataMap.put("D","800");

    setPieChart(mp_pieChart,dataMap,"数据",true);

-->设置饼形图属性
public void setPieChart(PieChart pieChart, Map<String, Float> pieValues, String title, boolean showLegend) {
    pieChart.setUsePercentValues(true);//设置使用百分比(后续有详细介绍)
    pieChart.getDescription().setEnabled(false);//设置描述
    pieChart.setExtraOffsets(25, 10, 25, 25); //设置边距
    pieChart.setDragDecelerationFrictionCoef(0.95f);//设置摩擦系数(值越小摩擦系数越大)
    pieChart.setCenterText(title);//设置环中的文字
    pieChart.setRotationEnabled(true);//是否可以旋转
    pieChart.setHighlightPerTapEnabled(true);//点击是否放大
    pieChart.setCenterTextSize(22f);//设置环中文字的大小
    pieChart.setDrawCenterText(true);//设置绘制环中文字
    pieChart.setRotationAngle(120f);//设置旋转角度
    pieChart.setTransparentCircleRadius(61f);//设置半透明圆环的半径,看着就有一种立体的感觉
    //这个方法为true就是环形图,为false就是饼图
    pieChart.setDrawHoleEnabled(false);
    //设置环形中间空白颜色是白色
    pieChart.setHoleColor(Color.WHITE);
    //设置半透明圆环的颜色
    pieChart.setTransparentCircleColor(Color.WHITE);
    //设置半透明圆环的透明度
    pieChart.setTransparentCircleAlpha(110);

    //图例设置
    Legend legend = pieChart.getLegend();
    if (showLegend) {
        legend.setEnabled(true);//是否显示图例
        legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);//图例相对于图表横向的位置
        legend.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);//图例相对于图表纵向的位置
        legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);//图例显示的方向
        legend.setDrawInside(false);
        legend.setDirection(Legend.LegendDirection.LEFT_TO_RIGHT);
    } else {
        legend.setEnabled(false);
    }

    //设置饼图数据
    setPieChartData(pieChart, pieValues);

    pieChart.animateX(1500, Easing.EasingOption.EaseInOutQuad);//数据显示动画

}

-->设置饼图数据
private void setPieChartData(PieChart pieChart, Map<String, Float> pieValues) {

    Set set = pieValues.entrySet();
    Iterator it = set.iterator();
    while (it.hasNext()) {
        Map.Entry entry = (Map.Entry) it.next();
        entries.add(new PieEntry(Float.valueOf(entry.getValue().toString()), entry.getKey().toString()));
    }

    PieDataSet dataSet = new PieDataSet(entries, "");
    dataSet.setSliceSpace(3f);//设置饼块之间的间隔
    dataSet.setSelectionShift(5f);//设置饼块选中时偏离饼图中心的距离
    dataSet.setColors(PIE_COLORS);//设置饼块的颜色

    //设置数据显示方式有见图
    dataSet.setValueLinePart1OffsetPercentage(80f);//数据连接线距图形片内部边界的距离,为百分数
    dataSet.setValueLinePart1Length(0.3f);
    dataSet.setValueLinePart2Length(0.4f);
    dataSet.setValueLineColor(Color.YELLOW);//设置连接线的颜色
    dataSet.setYValuePosition(PieDataSet.ValuePosition.OUTSIDE_SLICE);
    PieData pieData = new PieData(dataSet);
    pieData.setValueFormatter(new PercentFormatter());
    pieData.setValueTextSize(11f);
    pieData.setValueTextColor(Color.DKGRAY);

    pieChart.setData(pieData);
    pieChart.highlightValues(null);
    pieChart.invalidate();
}

如果想要有点击效果则
implements OnChartValueSelectedListener
会自动实现两个方法,一看就懂,这里就不赘述了
效果1.jpg

效果2.png

(今天先到这里,后续会持续更新)
—————————————————2018-01-12补充————————————————

有时候我们希望PieChart上显示的是具体数据而不是百分比,虽然原装库给我们提供了一个方法 
mChart.setUsePercentValues(true) 但是效果并不是我们想象的那个样子,虽然显示出来了原始的数据,但是后面有个%,什么鬼。于是自己又看了一下数据设置的方法
 PieData data = new PieData(dataSet);
 data.setValueFormatter(new PercentFormatter());//是否显示百分号
 data.setValueFormatter(new DefaultValueFormatter(1,"元"));//自己修改的方法
那个new PercentFormatter()就是库里原有的方法,我发现无法修改,又看了一下setValueFormatter方法,然后发现了最后一行这个方法,然后自己加了个参数,如图:
code1.png

然后就实现了你想要的效果(原库.jpg是将mChart.setUsePercentValues(false)后的效果)


原库.jpg
修改后.jpg

这就是我为什么会讲导入library的方法,如果原生的库足够满足需求还是直接用方法一直接添加依赖比较好。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,366评论 6 508
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,521评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 165,689评论 0 356
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,925评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,942评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,727评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,447评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,349评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,820评论 1 317
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,990评论 3 337
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,127评论 1 351
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,812评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,471评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,017评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,142评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,388评论 3 373
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,066评论 2 355