一个应用制作系列笔记（8）
MPAndroidChart是一款基于Android的开源图表库，MPAndroidChart不仅可以在Android设备上绘制各种统计图表，而且可以对图表进行拖动和缩放操作，应用起来非常灵活。MPAndroidChart同样拥有常用的图表类型：线型图、饼图、柱状图和散点图。
GitHub地址：
/PhilJay/MPAndroidChart
下面主要实现以下饼状图：
1.从上面的地址中下载最新mpandroidchartlibrary-2-0-8.jar包， 然后copy到项目的libs中
2. 定义xml文件
3. &主要Java逻辑代码如下，注释已经都添加上了。
效果图如下：
主要是一些基本属性和API的调用，具体每个API都有什么样的效果和作用，只能靠自己去尝试。后面还会陆陆续续为大家介绍MPAndroidChart其他类型的图表。
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：69460次
积分：1049
积分：1049
排名：千里之外
原创：17篇
转载：125篇
(1)(1)(4)(16)(21)(26)(7)(4)(27)(28)(1)(8)achartengine/MPAndroidChart——图表实现之Java
　　关于android的图表，这里就换作chart吧，如果要自己实现的话，那工作量可是很大的，好在有好几个开源的框架可以拿来使用，首先是achartengine了：achartengine github链接。其次是MPChart：MPAndroidChart github源码链接。关于更详细的介绍可以参考上面的链接，这里主要是简单讲下使用。因为没找到android studio的dependencies，所以就网上下载了相应的jar包了，具体已经在百度云上了，可以参考下面的链接。
　　链接: /s/1i4N2glB 密码: 2fe2
　　运行效果如下
　　?? 这里依次是atchartengine的折线图，MPAndroidChart的折线图和饼图。
　　achartengine
　　??至于怎么包含jar包，怎么建工程这就不多讲了，既然都要学习第三方的框架了，这些基础肯定有的了。首先是怎么把chart安在界面上，achartengine可以直接使用LinearLayout，然后把需要的chart绘画在这个LinearLayout上。具体xml如下所示：
android:id=&@+id/chart&
android:layout_width=&match_parent&
android:layout_height=&150dp&
android:orientation=&vertical&&
　　具体代码实现如下，基本上都加了注释了，理解起来还是很方便的了，具体看ChartActivity代码中：
　　??当然atchartengine还有其他更加强大的功能，这里只是简单用了下折线图。
　　MPAndroidChart
　　折线图配置
　　??MPAndroidChart的实现需要用到自定义的空间com.github.mikephil.charting.charts.LineChart来实现折线图：
&com.github.mikephil.charting.charts.LineChart
android:id=&@+id/spread_line_chart&
android:layout_width=&match_parent&
android:layout_height=&150dp& /&
??MPAndroidChart的实现需要用到自定义的空间com.github.mikephil.charting.charts.PieChart来实现折线图：
&com.github.mikephil.charting.charts.PieChart
android:id=&@+id/spread_pie_chart&
android:layout_width=&match_parent&
android:layout_height=&200dp&/&
act_chart xml实现
xmlns:android=&/apk/res/android&
android:layout_width=&match_parent&
android:layout_height=&match_parent&
android:orientation=&vertical&&
android:id=&@+id/chart&
android:layout_width=&match_parent&
android:layout_height=&150dp&
android:orientation=&vertical&&
android:id=&@+id/spread_line_chart&
android:layout_width=&match_parent&
android:layout_height=&150dp& /&
android:id=&@+id/spread_pie_chart&
android:layout_width=&match_parent&
android:layout_height=&200dp&/&
android:id=&@+id/getData&
android:layout_height=&wrap_content&
android:layout_width=&match_parent&
android:text=&获取当访问量& /&
ChartActivity java代码实现：
??代码的主要介绍在注释里面：
package com.jared.emdatabindingstudy.ui
import android.graphics.Color
import android.graphics.Paint
import android.graphics.Typeface
import android.os.Bundle
import android.support.annotation.Nullable
import android.util.DisplayMetrics
import android.view.View
import android.widget.Button
import android.widget.LinearLayout
import com.github.mikephil.charting.charts.LineChart
import com.github.mikephil.charting.charts.PieChart
import com.github.mikephil.charting.components.Legend
import com.github.mikephil.charting.components.XAxis
import com.github.mikephil.charting.components.YAxis
import com.github.mikephil.charting.data.Entry
import com.github.mikephil.charting.data.LineData
import com.github.mikephil.charting.data.LineDataSet
import com.github.mikephil.charting.data.PieData
import com.github.mikephil.charting.data.PieDataSet
import com.jared.emdatabindingstudy.R
import org.achartengine.ChartFactory
import org.achartengine.GraphicalView
import org.achartengine.chart.PointStyle
import org.achartengine.model.CategorySeries
import org.achartengine.model.XYMultipleSeriesDataset
import org.achartengine.renderer.XYMultipleSeriesRenderer
import org.achartengine.renderer.XYSeriesRenderer
import java.util.ArrayList
import java.util.List
public class ChartActivity extends BaseActivity {
private final static String TAG = ChartActivity.class.getSimpleName()
private LinearLayout chartLyt
private LineChart mLineChart
private PieChart mPieChart
Typeface mTf
private Button getDataBtn
private List lists = new ArrayList()
private void setLists() {
lists.clear()
for (int i = 1
int value = ((int) (Math.random() * 100))
lists.add(value)
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState)
setContentView(R.layout.act_chart)
getDataBtn = (Button) findViewById(R.id.getData)
getDataBtn.setOnClickListener(this)
chartLyt = (LinearLayout) findViewById(R.id.chart)
mTf = Typeface.createFromAsset(getAssets(), &OpenSans-Bold.ttf&)
drawTheChart()
drawTheChartByMPAndroid()
drawPieChart()
private void drawPieChart() {
mPieChart = (PieChart) findViewById(R.id.spread_pie_chart)
PieData mPieData = getPieData(4, 100)
showPieChart(mPieChart, mPieData)
private void showPieChart(PieChart pieChart, PieData pieData) {
pieChart.setHoleColorTransparent(true)
pieChart.setHoleRadius(40f)
pieChart.setTransparentCircleRadius(50f)
pieChart.setDescription(&&)
pieChart.setDrawHoleEnabled(true)
pieChart.setRotationAngle(90)
pieChart.setRotationEnabled(true)
pieChart.setUsePercentValues(true)
pieChart.setDrawCenterText(true)
pieChart.setCenterText(&人员分布&)
pieChart.setCenterTextColor(Color.GRAY)
pieChart.setCenterTextTypeface(mTf)
pieChart.setData(pieData)
Legend mLegend = pieChart.getLegend()
mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART)
mLegend.setXEntrySpace(10f)
mLegend.setYEntrySpace(5f)
mLegend.setTypeface(mTf)
mLegend.setTextColor(Color.GRAY)
pieChart.animateXY(1000, 1000)
private PieData getPieData(int count, float range) {
ArrayList xValues = new ArrayList()
content = new String[] {&&10&, &10~20&, &21~40&, &&40&}
for (int i = 0
xValues.add(&年龄(&+content[i]+&)&)
ArrayList yValue = new ArrayList()
List qs = new ArrayList()
qs.add(14f)
for (int i = 0
yValue.add(new Entry(qs.get(i), i))
PieDataSet pieDataSet = new PieDataSet(yValue, &2015浏览量统计&)
pieDataSet.setSliceSpace(0f)
ArrayList colors = new ArrayList()
//饼图颜色
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)
pieDataSet.setValueTextSize(8f)
pieDataSet.setValueTextColor(Color.WHITE)
pieDataSet.setValueTypeface(mTf)
DisplayMetrics metrics = getResources().getDisplayMetrics()
float px = 5 * (metrics.densityDpi / 160f)
pieDataSet.setSelectionShift(px)
PieData pieData = new PieData(xValues, pieDataSet)
return pieData
private void drawTheChartByMPAndroid() {
mLineChart = (LineChart) findViewById(R.id.spread_line_chart)
LineData lineData = getLineData(36, 1000)
showChart(mLineChart, lineData, Color.rgb(137, 230, 81))
private void showChart(LineChart lineChart, LineData lineData, int color) {
lineChart.setDrawBorders(false)
lineChart.setDescription(&&)
lineChart.setNoDataTextDescription(&You need to provide data for the chart.&)
lineChart.setDrawGridBackground(false)
lineChart.setGridBackgroundColor(Color.WHITE & 0x70FFFFFF)
lineChart.setTouchEnabled(true)
lineChart.setDragEnabled(true)
lineChart.setScaleEnabled(true)
lineChart.setPinchZoom(false)
lineChart.setBackgroundColor(color)
lineChart.setData(lineData)
Legend mLegend = lineChart.getLegend()
mLegend.setForm(Legend.LegendForm.CIRCLE)
mLegend.setFormSize(6f)
mLegend.setTextColor(Color.WHITE)
lineChart.setVisibleXRange(1, 7)
XAxis xAxis = lineChart.getXAxis()
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM)
xAxis.setTextColor(Color.WHITE)
xAxis.setTextSize(10f)
xAxis.setGridColor(Color.WHITE)
xAxis.setDrawGridLines(false)
xAxis.setTypeface(mTf)
YAxis axisLeft = lineChart.getAxisLeft()
YAxis axisRight = lineChart.getAxisRight()
axisLeft.setTextColor(Color.WHITE)
axisLeft.setTextSize(10f)
axisLeft.setAxisMaxValue(1000f)
axisLeft.setLabelCount(6, true)
axisLeft.setGridColor(Color.WHITE)
axisLeft.setTypeface(mTf)
axisRight.setDrawAxisLine(false)
axisRight.setDrawGridLines(false)
axisRight.setDrawLabels(false)
lineChart.animateX(2500)
private LineData getLineData(int count, float range) {
ArrayList xValues = new ArrayList()
for (int i = 0
// x轴显示的数据，这里默认使用数字下标显示
xValues.add(&& + (i+1))
// y轴的数据
ArrayList yValues = new ArrayList()
for (int i = 0
float value = (int) (Math.random() * range)
yValues.add(new Entry(value, i))
// create a dataset and give it a type
// y轴的数据集合
LineDataSet lineDataSet = new LineDataSet(yValues, &访问量统计&)
// mLineDataSet.setFillAlpha(110)
// mLineDataSet.setFillColor(Color.RED)
//用y轴的集合来设置参数
lineDataSet.setLineWidth(1.75f)
lineDataSet.setCircleSize(3f)
lineDataSet.setColor(Color.WHITE)
lineDataSet.setCircleColor(Color.WHITE)
lineDataSet.setHighLightColor(Color.WHITE)
lineDataSet.setHighlightEnabled(true)
lineDataSet.setValueTextColor(Color.WHITE)
lineDataSet.setValueTextSize(8f)
lineDataSet.setValueTypeface(mTf)
ArrayList lineDataSets = new ArrayList()
lineDataSets.add(lineDataSet)
//创建lineData
LineData lineData = new LineData(xValues, lineDataSets)
return lineData
public void drawTheChart() {
XYMultipleSeriesRenderer mRenderer = getXYMulSeriesRenderer()
XYSeriesRenderer renderer = getXYSeriesRenderer()
mRenderer.addSeriesRenderer(renderer)
setLists()
XYMultipleSeriesDataset dataset = getDataSet()
GraphicalView chartView = ChartFactory.getLineChartView(this, dataset, mRenderer)
chartLyt.addView(chartView, 0)
//chartLyt.invalidate()
public XYSeriesRenderer getXYSeriesRenderer() {
XYSeriesRenderer renderer = new XYSeriesRenderer()
//设置折线宽度
renderer.setLineWidth(2)
//设置折线颜色
renderer.setColor(Color.GRAY)
renderer.setDisplayBoundingPoints(true)
//点的样式
renderer.setPointStyle(PointStyle.CIRCLE)
//设置点的大小
renderer.setPointStrokeWidth(3)
//设置数值显示的字体大小
renderer.setChartValuesTextSize(30)
//显示数值
renderer.setDisplayChartValues(true)
return renderer
public XYMultipleSeriesDataset getDataSet() {
XYMultipleSeriesDataset barDataset = new XYMultipleSeriesDataset()
CategorySeries barSeries = new CategorySeries(&2016年&)
for (int i = 0
barSeries.add(lists.get(i))
barDataset.addSeries(barSeries.toXYSeries())
return barDataset
public XYMultipleSeriesRenderer getXYMulSeriesRenderer() {
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer()
renderer.setMarginsColor(Color.argb(0x00, 0xF3, 0xF3, 0xF3))
// 设置背景颜色
renderer.setApplyBackgroundColor(true)
renderer.setBackgroundColor(Color.WHITE)
//设置Title的内容和大小
renderer.setChartTitle(&访问量统计&)
renderer.setChartTitleTextSize(50)
//图表与四周的边距
renderer.setMargins(new int[]{80, 80, 50, 50})
//设置X,Y轴title的内容和大小
renderer.setXTitle(&日期&)
renderer.setYTitle(&访问数&)
renderer.setAxisTitleTextSize(30)
//renderer.setAxesColor(Color.WHITE)
renderer.setLabelsColor(Color.BLACK)
//图例文字的大小
renderer.setLegendTextSize(20)
// x、y轴上刻度颜色和大小
renderer.setXLabelsColor(Color.BLACK)
renderer.setYLabelsColor(0, Color.BLACK)
renderer.setLabelsTextSize(20)
renderer.setYLabelsPadding(30)
// 设置X轴的最小数字和最大数字，由于我们的数据是从1开始，所以设置为0.5就可以在1之前让出一部分
// 有兴趣的童鞋可以删除下面两行代码看一下效果
renderer.setPanEnabled(false, false)
//显示网格
renderer.setShowGrid(true)
//X,Y轴上的数字数量
renderer.setXLabels(10)
renderer.setYLabels(10)
// 设置X轴的最小数字和最大数字
renderer.setXAxisMin(1)
renderer.setXAxisMax(20)
// 设置Y轴的最小数字和最大数字
renderer.setYAxisMin(0)
renderer.setYAxisMax(100)
// 设置渲染器显示缩放按钮
renderer.setZoomButtonsVisible(true)
// 设置渲染器允许放大缩小
renderer.setZoomEnabled(true)
// 消除锯齿
renderer.setAntialiasing(true)
// 刻度线与X轴坐标文字左侧对齐
renderer.setXLabelsAlign(Paint.Align.LEFT)
// Y轴与Y轴坐标文字左对齐
renderer.setYLabelsAlign(Paint.Align.LEFT)
// 允许左右拖动,但不允许上下拖动.
renderer.setPanEnabled(true, false)
return renderer
public void onClick(View view) {
super.onClick(view)
switch (view.getId()) {
case R.id.getData:
drawTheChart()
drawTheChartByMPAndroid()
drawPieChart()2536人阅读
android开发总结（69）
pieChart 常用属性详解:
// 设置 pieChart 图表基本属性
mChart.setUsePercentValues(false);
//使用百分比显示
mChart.getDescription().setEnabled(false);
//设置pieChart图表的描述
mChart.setBackgroundColor(Color.YELLOW);
//设置pieChart图表背景色
mChart.setExtraOffsets(5, 10, 60, 10);
//设置pieChart图表上下左右的偏移，类似于外边距
mChart.setDragDecelerationFrictionCoef(0.95f);//设置pieChart图表转动阻力摩擦系数[0,1]
mChart.setRotationAngle(0);
//设置pieChart图表起始角度
mChart.setRotationEnabled(true);
//设置pieChart图表是否可以手动旋转
mChart.setHighlightPerTapEnabled(true);
//设置piecahrt图表点击Item高亮是否可用
mChart.animateY(1400, Easing.EasingOption.EaseInOutQuad);// 设置pieChart图表展示动画效果
// 设置 pieChart 图表Item文本属性
mChart.setDrawEntryLabels(true);
//设置pieChart是否只显示饼图上百分比不显示文字（true：下面属性才有效果）
mChart.setEntryLabelColor(Color.WHITE);
//设置pieChart图表文本字体颜色
mChart.setEntryLabelTypeface(mTfRegular);
//设置pieChart图表文本字体样式
mChart.setEntryLabelTextSize(10f);
//设置pieChart图表文本字体大小
// 设置 pieChart 内部圆环属性
mChart.setDrawHoleEnabled(true);
//是否显示PieChart内部圆环(true:下面属性才有意义)
mChart.setHoleRadius(28f);
//设置PieChart内部圆的半径(这里设置28.0f)
mChart.setTransparentCircleRadius(31f);
//设置PieChart内部透明圆的半径(这里设置31.0f)
mChart.setTransparentCircleColor(Color.BLACK);//设置PieChart内部透明圆与内部圆间距(31f-28f)填充颜色
mChart.setTransparentCircleAlpha(50);
//设置PieChart内部透明圆与内部圆间距(31f-28f)透明度[0~255]数值越小越透明
mChart.setHoleColor(Color.WHITE);
//设置PieChart内部圆的颜色
mChart.setDrawCenterText(true);
//是否绘制PieChart内部中心文本（true：下面属性才有意义）
mChart.setCenterTextTypeface(mTfLight);
//设置PieChart内部圆文字的字体样式
mChart.setCenterText(&Test&);
//设置PieChart内部圆文字的内容
mChart.setCenterTextSize(10f);
//设置PieChart内部圆文字的大小
mChart.setCenterTextColor(Color.RED);
//设置PieChart内部圆文字的颜色
// pieChart添加数据
setData();
// 获取pieCahrt图列
Legend l = mChart.getLegend();
l.setEnabled(true);
//是否启用图列（true：下面属性才有意义）
l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.RIGHT);
l.setOrientation(Legend.LegendOrientation.VERTICAL);
l.setForm(Legend.LegendForm.DEFAULT); //设置图例的形状
l.setFormSize(10);
//设置图例的大小
l.setFormToTextSpace(10f);
//设置每个图例实体中标签和形状之间的间距
l.setDrawInside(false);
l.setWordWrapEnabled(true);
//设置图列换行(注意使用影响性能,仅适用legend位于图表下面)
l.setXEntrySpace(10f);
//设置图例实体之间延X轴的间距（setOrientation = HORIZONTAL有效）
l.setYEntrySpace(8f);
//设置图例实体之间延Y轴的间距（setOrientation = VERTICAL 有效）
l.setYOffset(0f);
//设置比例块Y轴偏移量
l.setTextSize(14f);
//设置图例标签文本的大小
l.setTextColor(Color.parseColor(&#ff9933&));//设置图例标签文本的颜色
//pieChart 选择监听
mChart.setOnChartValueSelectedListener(this);
//设置MARKERVIEW
CustomMarkerView mv = new CustomMarkerView(this, new PercentFormatter());
mv.setChartView(mChart);
mChart.setMarker(mv);
* 设置饼图的数据
private void setData() {
ArrayList&PieEntry& pieEntryList = new ArrayList&PieEntry&();
ArrayList&Integer& colors = new ArrayList&Integer&();
colors.add(Color.parseColor(&#f17548&));
colors.add(Color.parseColor(&#FF9933&));
//饼图实体 PieEntry
PieEntry CashBalance = new PieEntry(70, &现金余额 1500&);
PieEntry ConsumptionBalance = new PieEntry(30, &消费余额 768&);
pieEntryList.add(CashBalance);
pieEntryList.add(ConsumptionBalance);
//饼状图数据集 PieDataSet
PieDataSet pieDataSet = new PieDataSet(pieEntryList, &资产总览&);
pieDataSet.setSliceSpace(3f);
//设置饼状Item之间的间隙
pieDataSet.setSelectionShift(10f);
//设置饼状Item被选中时变化的距离
pieDataSet.setColors(colors);
//为DataSet中的数据匹配上颜色集(饼图Item颜色)
//最终数据 PieData
PieData pieData = new PieData(pieDataSet);
pieData.setDrawValues(true);
//设置是否显示数据实体(百分比，true:以下属性才有意义)
pieData.setValueTextColor(Color.BLUE);
//设置所有DataSet内数据实体（百分比）的文本颜色
pieData.setValueTextSize(12f);
//设置所有DataSet内数据实体（百分比）的文本字体大小
pieData.setValueTypeface(mTfLight);
//设置所有DataSet内数据实体（百分比）的文本字体样式
pieData.setValueFormatter(new PercentFormatter());//设置所有DataSet内数据实体（百分比）的文本字体格式
mChart.setData(pieData);
mChart.highlightValues(null);
mChart.invalidate();
//将图表重绘以显示设置的属性和数据
使用参照：
http://blog.csdn.net/column/details/13579.html
http://blog.csdn.net/u/article/category/6020813
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：139376次
积分：1833
积分：1833
排名：千里之外
原创：32篇
转载：70篇
评论：15条
(1)(3)(4)(1)(1)(4)(4)(1)(2)(2)(2)(4)(4)(1)(1)(1)(3)(1)(1)(1)(1)(2)(2)(7)(12)(18)(1)(2)(2)(12)(1)笑谈Android图表------MPAndroidCharts
MPChart是一款基于Android的开源图表库，MPAndroidChart不仅可以在Android设备上绘制各种统计图表，而且可以对图表进行拖动和缩放操作，应用起来非常灵活。MPAndroidChart显得更为轻巧和简单，拥有常用的图表类型：线型图、饼图、柱状图和散点图。
欢迎大家吐槽，小弟初来炸到，这是本人写的第一篇博客，希望大家多提意见，不胜感激
图表效果图
RadarChart
图表常用功能及方法介绍：
XY轴的绘制
setEnabled(boolean enabled):设置轴是否被绘制。默认绘制,false不会被绘制。 setDrawLabels(boolean enabled):设置为true打开绘制轴的标签。 setDrawAxisLine(boolean enabled): 设置为true，绘制轴线 setDrawGridLines(boolean enabled): 设置为true绘制网格线。
定义轴线样式
setTextColor(int color): 设置轴标签文本颜色。 setTextSize(float size):设置轴标签的字体大小。 setTypeface(Typeface tf):设置轴标签的自定义Typeface（Typeface.createFromAsset(getAssets(), &字体文件名&);） setGridColor(int color): 设置网格线颜色。 setGridLineWidth(float width):设置网格线宽度。 setAxisLineColor(int color):设置此轴的坐标轴的颜色。 setAxisLineWidth(float width): 设置此轴的坐标轴的宽度。 setVisibleXRangeMaximum(float maxXRange):设置x轴最多显示数据条数，（要在设置数据源后调用，否则是无效的） enableGridDashedLine(float lineLength, float spaceLength, float phase): 显示网格线虚线模式，&lineLength&控制短线条的长度，&spaceLength&控制两段线之间的间隔长度，&phase&控制开始的点。
图表交互设置
setTouchEnabled(boolean enabled): 允许你打开或者关闭与图表的所有触摸交互的情况。 setDragEnabled(boolean enabled): 打开或关闭对图表的拖动。 setScaleEnabled(boolean enabled):打开或关闭对图表所有轴的的缩放。 setScaleXEnabled(boolean enabled): 打开或关闭x轴的缩放 setScaleYEnabled(boolean enabled): 打开或关闭y轴的缩放。 setPinchZoom(boolean enabled): 如果设置为true，挤压缩放被打开。如果设置为false，x和y轴可以被单独挤压缩放。 setHighlightEnabled(boolean enabled): 如果设置为true，在图表中选中触屏高亮。 setHighlightPerDragEnabled(boolean enabled): 设置为true时允许高亮显示拖动结束的对象在缩放到最下时。默认：true setHighlightIndicatorEnabled(boolean enabled): 如果设置为true， 指标线（或杆）将展示被选择的线的绘制的值。 自定义轴线的值
setAdjustXLabels(boolean enabled):如果被设置为true，x轴条目将依赖于它自己在进行缩放的时候。如果设置为false，x轴条目将总是保持相同。 setAvoidFirstLastClipping(boolean enabled):如果设置为true，图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘。 setSpaceBetweenLabels(int characters): 设置x轴标签之间的空间字符数，默认是4个。 setPosition(XAxisPosition pos):设置XAxis应该出现的位置。可以选择TOP，BOTTOM，BOTH_SIDED，TOP_INSIDE或者BOTTOM_INSIDE。 setStartAtZero(boolean enabled):如果这个打开，轴线总是有最小值0,无论什么类型的图表被展示。 setAxisMaxValue(float max):设置一个自定义的最大值为这条轴，如果设置了，这个值将不会依赖于提供的数据自动计算。 resetAxisMaxValue(): 调用这个将撤销以前设置的最大值。这意味着，你将再次允许轴自动计算它的最大值。 setAxisMinValue(float min): 设置一个自定义的最小值。如果设置了，这个值将不会依赖于你提供的数据进行自动计算。 resetAxisMinValue():调用这个方法撤销以前设置的最小值。这意味着，你将再次允许轴自动计算他的最小值。 setInverted(boolean enabled): 如果设置为true，这个轴将被反向，那意味着最高出的将到底部，最低部的到顶端。 setSpaceTop(float percent):设置在图表上最高处的值相比轴上最高值的顶端空间（总轴范围的百分比） setSpaceBottom(float percent): 设置在图表上最低处的值相比轴上最低处值的底部空间（总轴范围的百分比） setShowOnlyMinMax(boolean enabled): 如果打开了，这个轴将展示出它的最小值和最大值。这将忽略或者覆盖定义过的label-count。 setPosition(YAxisLabelPosition pos):设置轴标签应该被绘制的位置。INSIDE_CHART或者OUTSIDE_CHART中的一个。 自定义影响轴的数值范围应该在图表被设置数据之前应用。
创建图表（LineChart举例）
布局文件: activity_barchart.xml
BarCharts.java
package com.charts.xh.
import android.app.A
import android.content.I
import android.graphics.C
import android.os.B
import android.util.L
import android.widget.T
import com.charts..charts.xh.utils.CustomerValueF
import com.charts..charts.xh.utils.MyYValueF
import com.github.mikephil.charting.charts.BarC
import com.github.ponents.L
import com.github.ponents.Legend.LegendF
import com.github.ponents.Legend.LegendP
import com.github.ponents.XAxis.XAxisP
import com.github.ponents.XA
import com.github.ponents.YA
import com.github.mikephil.charting.data.BarD
import com.github.mikephil.charting.data.BarDataS
import com.github.mikephil.charting.data.BarE
import com.github.mikephil.charting.data.E
import com.github.mikephil.charting.highlight.H
import com.github.mikephil.charting.interfaces.datasets.IBarDataS
import com.github.mikephil.charting.listener.OnChartValueSelectedL
import java.util.ArrayL
public class BarCharts1 extends Activity implements
OnChartValueSelectedListener {
private BarChart mC
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_barchart);
mChart = (BarChart) findViewById(R.id.chart1);
mChart.setOnChartValueSelectedListener(this);
mChart.setDescription(&市场拓展表&);
mChart.setNoDataTextDescription(&You need to provide data for the chart.&);
mChart.setDrawValueAboveBar(true);//将Y数据显示在点的上方
// mChart.setDrawBorders(true);
// scaling can now only be done on x- and y-axis separately
mChart.setPinchZoom(true);//挤压缩放
mChart.setDrawBarShadow(false);
mChart.setDrawGridBackground(false);
mChart.setScaleYEnabled(false);
mChart.setDoubleTapToZoomEnabled(false);//双击缩放
mChart.getXAxis().setPosition(XAxisPosition.BOTTOM);//x轴位置
// create a custom MarkerView (extend MarkerView) and specify the layout
// to use for it
MarkerView
MyMarkerView mv = new MyMarkerView(this, R.layout.custom_marker_view);
// define an offset to change the original position of the marker
// (optional)
// mv.setOffsets(-mv.getMeasuredWidth() / 2, -mv.getMeasuredHeight());
// set the marker to the chart
mChart.setMarkerView(mv);
Legend l = mChart.getLegend();//图例
l.setPosition(LegendPosition.RIGHT_OF_CHART_INSIDE);
l.setTextSize(10f);
l.setFormSize(10f); // set the size of the legend forms/shapes
l.setForm(LegendForm.CIRCLE);
l.setWordWrapEnabled(true);
l.setPosition(LegendPosition.BELOW_CHART_CENTER);
XAxis xl = mChart.getXAxis();
xl.setLabelRotationAngle(-20);//设置x轴字体显示角度
//xl.setPosition(XAxisPosition.BOTTOM);
YAxis leftAxis = mChart.getAxisLeft();
//leftAxis.setValueFormatter(new LargeValueFormatter());//
leftAxis.setValueFormatter(new MyYValueFormatter());//自定义y数据格式化方式
leftAxis.setDrawGridLines(false);//是否画线
leftAxis.setSpaceTop(30f);
leftAxis.setAxisMinValue(0f); // this replaces setStartAtZero(true)
mChart.getAxisRight().setEnabled(false);
setData(10);
public void setData(int num) {
ArrayList xVals = new ArrayList();
for (int i = 0; i & i++) {
xVals.add( &小谢&+ i);
ArrayList yVals1 = new ArrayList();
ArrayList yVals2 = new ArrayList();
ArrayList yVals3 = new ArrayList();
for (int i = 0; i & i++) {
float val = (float) (Math.random() * num);
yVals1.add(new BarEntry(val, i));
for (int i = 0; i & i++) {
float val = (float) (Math.random() * num);;
yVals2.add(new BarEntry(val, i));
for (int i = 0; i & i++) {
float val = (float) (Math.random() * num);
yVals3.add(new BarEntry(val, i));
// create 3 datasets with different types
BarDataSet set1 = new BarDataSet(yVals1, &一季度&);
// set1.setColors(ColorTemplate.createColors(getApplicationContext(),
// ColorTemplate.FRESH_COLORS));
set1.setColor(Color.rgb(104, 241, 175));
BarDataSet set2 = new BarDataSet(yVals2, &二季度&);
set2.setColor(Color.rgb(164, 228, 251));
BarDataSet set3 = new BarDataSet(yVals3, &三季度&);
set3.setColor(Color.rgb(242, 247, 158));
ArrayList dataSets = new ArrayList();
dataSets.add(set1);
dataSets.add(set2);
dataSets.add(set3);
BarData data = new BarData(xVals, dataSets);
// data.setValueFormatter(new LargeValueFormatter());
// add space between the dataset groups in percent of bar-width
data.setValueFormatter(new CustomerValueFormatter());
data.setDrawValues(true);
data.setValueTextColor(Color.BLACK);
data.setValueTextSize(13);
data.setGroupSpace(80f);//设置组数据间距
//data.setValueTypeface(tf);
mChart.setData(data);
mChart.animateXY(800,800);//图表数据显示动画
mChart.setVisibleXRangeMaximum(15);//设置屏幕显示条数
mChart.invalidate();
public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
Log.i(&Activity&, &Selected: & + e.toString() + &, dataSet: &
+ dataSetIndex);
Toast.makeText(this, e.getXIndex()+&valu&+e.getVal()+e.getData(),
public void onNothingSelected() {
Log.i(&Activity&, &Nothing selected.&);
MyMarkerView .java
package com.charts.xh.
import android.content.C
import android.widget.TextV
import com.github.ponents.MarkerV
import com.github.mikephil.charting.data.CandleE
import com.github.mikephil.charting.data.E
import com.github.mikephil.charting.highlight.H
import com.github.mikephil.charting.utils.U
* Custom implementation of the MarkerView.
* @author Philipp Jahoda
public class MyMarkerView extends MarkerView {
private TextView tvC
public MyMarkerView(Context context, int layoutResource) {
super(context, layoutResource);
tvContent = (TextView) findViewById(R.id.tvContent);
// callbacks everytime the MarkerView is redrawn, can be used to update the
// content (user-interface)
public void refreshContent(Entry e, Highlight highlight) {
if (e instanceof CandleEntry) {
CandleEntry ce = (CandleEntry)
tvContent.setText(&& + Utils.formatNumber(ce.getHigh(), 0, true));
tvContent.setText(&& + Utils.formatNumber(e.getVal(), 0, true));
public int getXOffset(float xpos) {
// this will center the marker-view horizontally
return -(getWidth() / 2);
public int getYOffset(float ypos) {
// this will cause the marker-view to be above the selected value
return -getHeight();
MyMarkerView 布局文件 custom_marker_view.xml
Y轴线数据格式化 MyYValueFormatter .java
package com.charts..charts.xh.
import com.github.ponents.YA
import com.github.mikephil.charting.formatter.YAxisValueF
import java.text.DecimalF
public class MyYValueFormatter implements YAxisValueFormatter {
private DecimalFormat mF
public MyYValueFormatter() {
mFormat = new DecimalFormat(&###,###,###,##0&);
public String getFormattedValue(float value, YAxis yAxis) {
return mFormat.format(value);
Gradle 依赖
repositories {
maven { url &https://jitpack.io& }
dependencies {
compile 'com.github.PhilJay:MPAndroidChart:v2.2.5'
如果用的Eclipse只需要将jar包拷贝到项目libs目录下，即可开发是用MPAndroidCharts库，
MPAndroidCharts常见问题
1 . 如何显示隐藏Y轴线及自定义轴线的显示样式
mChart.getAxisLeft().setEnabled(false) //隐藏Y轴左边轴线，此时标签数字也隐藏
mChart.getAxisRight().setEnabled(false) //隐藏Y轴右边轴线，此时标签数字也隐藏
如果想隐藏轴线但是想显示数字标签：
mChart.getAxisRight().setDrawAxisLine(false);
2 . Y轴线数据标签怎么自己控制显示个数
mChart.getAxisLeft().setLabelCount(8, false);//此时设置了分8个，可根据自己喜好设置
3 . 怎么设置轴线颜色，宽度等信息
YAxis leftAxis = mChart.getAxisLeft();
leftAxis . setPosition(YAxisLabelPosition.OUTSIDE_CHART);/ /显示轴线内部INSIDE_CHART
leftAxis.setAxisLineColor(Color.parseColor(&#ff0000&));//设置轴线颜色：leftAxis.setAxisLineWidth(1);// 设置轴线宽度
leftAxis.setTextSize(20);//设置y轴标签字体大小
leftAxis.setTypeface();//设置自定义字体
leftAxis.setDrawGridLines(Boolean );//设置是否显示网格线，
4 . 怎么将Y轴线数据前面加上￥人民币符号
import com.github.ponents.YA
import com.github.mikephil.charting.formatter.YAxisValueF
import java.text.DecimalF
public class MyYValueFormatter implements YAxisValueFormatter {
private DecimalFormat mF
public MyYValueFormatter() {
mFormat = new DecimalFormat(&###,###,###,##0&);
public String getFormattedValue(float value, YAxis yAxis) {
return &￥&+mFormat.format(value);
5 . 图表里面边缘标签数据显示不全，显示到界面外面如何处理
mChart.setExtraLeftOffset(float);
mChart.setExtraTopOffset(float);
mChart.setExtraRightOffset(float);
mChart.setExtraBottomOffset(float);
mChart.setExtraOffsets(float left, float top, float right, float bottom);//此种方法可以一次设置上下左右便宜。根据自己数据哪个地方显示不全，对应调用方法
6 . 怎么实现X轴 对应的Y数据显示整型
import com.github.mikephil.charting.data.E
import com.github.mikephil.charting.formatter.ValueF
import com.github.mikephil.charting.utils.ViewPortH
import java.text.DecimalF
public class CustomerValueFormatter implements ValueFormatter {
private DecimalFormat mF
public CustomerValueFormatter() {
//此处是显示数据的方式，显示整型或者小数后面小数位数自己随意确定
mFormat = new DecimalFormat(&###,###,###,##0&);
public String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) {
return mFormat.format(value);//数据前或者后可根据自己想要显示的方式添加
注：百分比自带PercentFormatter，当然上面自定义可以定义你任何想要的方式。
7 . 将x轴标签倾斜显示（如问题6里面x轴标签效果）
XAxis xl = mChart.getXAxis();
xl.setLabelRotationAngle(-20);//设置x轴字体显示角度
xl.setPosition(XAxisPosition.BOTTOM);//设置X轴的位置TOP, BOTTOM, BOTH_SIDED, TOP_INSIDE, BOTTOM_INSIDE
xl.setSpaceBetweenLabels(int spaceCharacters)//设置Lable之间的距离（字符），小于距离将不显示，需要放大图标才能看到
8 . 设置x轴对应y数据
data.setDrawValues(false);//隐藏数据
data.setValueTextSize(20f);//设置字体大小
data.setValueTypeface(mTf);//自定义字体
setValueTextColor(int color)//设置字体颜色
setValueTextColors(List colors)//可设置多种颜色
9 . Barchart表设置柱体之间的距离无效
vcq9o6zI58nPzby1xDG6zTKjujwvcD4NCsno1sMxvOS+4A0KPHByZSBjbGFzcz0="brush:">
BarDataSet set1 = new BarDataSet(yVals1, &DataSet&);
set1.setBarSpacePercent(50f);
data.setGroupSpace(float);//设置一页显示的数据条数，超出的数量需要滑动查看：
所以设置间距要看你的数据，及设置的是哪个间距，只有调用对应的方法间距才能生效。由于这个间隔设置是按百分比的，如果数据较多用户体验会很差，可以适当配合问题10设置一页显示的数量，可美观界面。
10 . 一个页面显示的数据太多了，都不看清楚，怎么样设置一个页面显示固定条数的数据，如果数据太多需要手动滑动看到
//设置一页显示的数据条数，超出的数量需要滑动查看：
mChart.setVisibleXRangeMaximum(int);//需要在设置数据源后生效
11 . 如何设置图例样式
Legend l = mChart.getLegend();
//l.setEnable(false);//不显示图例，默认true 显示
/**图例位置的枚举类有下面几种：
RIGHT_OF_CHART, RIGHT_OF_CHART_CENTER, RIGHT_OF_CHART_INSIDE,
LEFT_OF_CHART, LEFT_OF_CHART_CENTER, LEFT_OF_CHART_INSIDE,
BELOW_CHART_LEFT, BELOW_CHART_RIGHT, BELOW_CHART_CENTER,
ABOVE_CHART_LEFT, ABOVE_CHART_RIGHT, ABOVE_CHART_CENTER,
PIECHART_CENTER
l.setPosition(LegendPosition.RIGHT_OF_CHART_INSIDE);//设置图例的位置
l.setTextSize(10f);
l.setFormSize(10f); // set the size of the legend forms/shapes
l.setForm(LegendForm.CIRCLE);//设置图例形状， SQUARE(方格) CIRCLE（圆形） LINE（线性）
l.setWordWrapEnabled(true);//此方法影响性能，尽量不用，默认是fasle的
第一次写博客，由于水平有限可能有一些理解不是很深刻，可能有很多不足的地方，希望大家指正，本文是出于自己学习的目的，做一些记录，当然如果对大家有帮助在下实在荣幸。
注：写博客好难啊&真佩服那些经常写博客的大神。