
大家好,这篇简书记录一下我在项目中遇到的MPAndroidChart的一些问题。
这个库star很高,但是没有中文文档,demo感觉也不够友好,并且百度讲解大多都是比较规范的流程。之前在用线性表格和饼状图
的时候
还是比较简单。但是这次用到了BarChart
,并且使用了分组柱状图。同时又是在日期为横坐标的场景下。
下面大概列举下我遇到的坑。
日期横坐标
用过这个库的朋友们,应该都知道坐标轴可以setValueFormatter
来格式化横坐标显示的值。刚开始
我想当然的觉得直接横坐标传时间戳,然后在格式化成日期:
xAxis.valueFormatter=object :ValueFormatter(){
override fun getFormattedValue(value: Float): String {
return TimeUtil.time2Str(value.toLong())
}
}
然后横坐标直接传时间戳:
var yVals1: ArrayList<BarEntry> = ArrayList()
for (i in 0..10) {
var barEntry = BarEntry((System.currentTimeMillis()+TimeUtil.day*i).toFloat(), (i + .1f * i).toFloat())
yVals1.add(barEntry)
}
val set1 = chart.getData().getDataSetByIndex(0) as BarDataSet
set1.setValues(yVals1);
chart.getData().notifyDataChanged();
chart.notifyDataSetChanged();
这样的结果就是 我进页面时,没有柱状图的柱子。。

我开始真的是百思不得其解。研究了好久。然后才发现,不是没有柱子,是看不到柱子。因为:

他默认的barwidth 也就是柱子的默认宽度是0.85f。然而我的横坐标是时间戳,时间戳值很大,导致看不到柱子

这就真的很细了。。。这是我自己觉得一个很深的坑。那怎么解决这个问题呢? 我尝试着把barwidth
设置的很大很大
barData?.barWidth=10000000000f
然后再跑:

柱子有了,但是应为设置的太大宽度超单位了,想来想去这样的处理方法并不是很好,于是我想的是通过设
置开始时间戳,然后在setValueFormatter中通过位移天数算出具体的时间。这样横坐标也就可以直接传位移
天数这种比较小的值了:
val timeStamp = startTimeStamp!! + (value.toInt()-1) * 24 * 60 * 60 * 1000
val str = TimeUtil.time2Str(timeStamp.toLong())
return str
修改后 横坐标直接传入距离开始时间的天数结果如下:

添加BarEntry后,数据错乱的问题
因为后台接口返回的数据是不连续的按时间降序来的一串yyyy-MM-dd的按时间降序排列的数据List.刚开始的
时候我直接请求接口后拿下来直接addEntry
,结果渲染出来的数据总是错乱的。具体情况我就不截图了,
我发现造成错乱的原因是addEntry的时候没有按照坐标从大到小添加的,并且不连贯
,导致出的问题。
处理方式是将按照从小到大的顺序添加数据,并且不连贯的地方添加为value为0的Entry
groupBar柱子和坐标偏移的问题
分组柱状图的时候,不管你怎么设置,他组柱子始终是按着顺序依次往后加,
比如你两个横坐标同为1的同一组数据,他渲染之后 ,第一个柱子的横坐标可能是0.85555第二个柱子的横坐标是1.3555这样式来的,这样会导致如果你两个柱子的宽和间距相加后大于你的单位坐标展示宽度,就会让后面的所有数据逐渐偏移。解决办法是按照你实际情况调整
barData.setBarWidth(0.37f);//每个柱子的宽度
barData.groupBars(0f,0.26f,0.0f)
尽量使他们相加后等于1个单位的展示宽度
网友评论