MPAndroidChart是一款基于Android的开源图表库,MPAndroidChart不仅可以在Android设备上绘制各种统计图表,而且可以对图表进行拖动和缩放操作,应用起来非常灵活。和前面介绍的AChartEngine相比,MPAndroidChart显得更为轻巧和简单,MPAndroidChart同样拥有常用的图表类型:线型图、饼图、柱状图和散点图。
效果图:有图有真相
package com.test.demo.demo.widget;
import android.content.Context;
import android.widget.TextView;
import com.github.mikephil.charting.components.MarkerView;
import com.github.mikephil.charting.data.CandleEntry;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.utils.Utils;
import com.test.demo.demo.R;
import com.test.demo.demo.utils.UnitUtils;
/**
* 作者:zengtao
* 邮箱:1039562669@qq.com
* 时间:2015/10/13 0013 19:08
*/
public class MyMarkView extends MarkerView {
private TextView tvMarkText;
public MyMarkView(Context context) {
super(context, R.layout.mark_view);
tvMarkText = (TextView) findViewById(R.id.tvMarkText);
}
@Override
public void refreshContent(Entry entry, Highlight highlight) {
if (entry instanceof CandleEntry) {
CandleEntry ce = (CandleEntry) entry;
tvMarkText.setText("" + Utils.formatNumber(ce.getHigh(), 0, true));
} else {
tvMarkText.setText("" + entry.getVal());
}
}
@Override
public int getXOffset() {
return -(getWidth() / 2);
}
@Override
public int getYOffset() {
return -getHeight() - UnitUtils.dp2px(getContext(), 2);
}
}
布局
package com.test.demo.demo;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.test.demo.demo.widget.MyMarkView;
import java.util.ArrayList;
import butterknife.ButterKnife;
import butterknife.InjectView;
/**
* 作者:zengtao
* 邮箱:1039562669@qq.com
* 时间:2015/10/13 0013 20:01
*/
public class LineChartActivity extends AppCompatActivity {
@InjectView(R.id.lineChart)
LineChart mChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_line_chart);
ButterKnife.inject(this);
initChart();
}
/**
* 1.初始化LineChart
* 2.添加数据x,y轴数据
* 3.刷新图表
*/
private void initChart() {
/**
* ====================1.初始化-自由配置===========================
*/
// 是否在折线图上添加边框
mChart.setDrawGridBackground(false);
mChart.setDrawBorders(false);
// 设置右下角描述
mChart.setDescription("");
//设置透明度
mChart.setAlpha(0.8f);
//设置网格底下的那条线的颜色
mChart.setBorderColor(Color.rgb(213, 216, 214));
//设置高亮显示
mChart.setHighlightEnabled(true);
//设置是否可以触摸,如为false,则不能拖动,缩放等
mChart.setTouchEnabled(true);
//设置是否可以拖拽
mChart.setDragEnabled(false);
//设置是否可以缩放
mChart.setScaleEnabled(false);
//设置是否能扩大扩小
mChart.setPinchZoom(false);
/**
* ====================2.布局点添加数据-自由布局===========================
*/
// 折线图的点,点击战士的布局和数据
MyMarkView mv = new MyMarkView(this);
mChart.setMarkerView(mv);
// 加载数据
LineData data = getLineData();
mChart.setData(data);
/**
* ====================3.x,y动画效果和刷新图表等===========================
*/
//从X轴进入的动画
mChart.animateX(4000);
mChart.animateY(3000); //从Y轴进入的动画
mChart.animateXY(3000, 3000); //从XY轴一起进入的动画
//设置最小的缩放
mChart.setScaleMinima(0.5f, 1f);
Legend l = mChart.getLegend();
l.setForm(Legend.LegendForm.LINE); //设置图最下面显示的类型
l.setTextSize(15);
l.setTextColor(Color.rgb(104, 241, 175));
l.setFormSize(30f);
// 刷新图表
mChart.invalidate();
}
private LineData getLineData() {
String[] xx = {"2", "4", "6", "8", "10", "12", "14", "16", "18"};
String[] yy = {"20", "80", "10", "60", "30", "70", "55", "22", "40"};
ArrayList xVals = new ArrayList();
for (int i = 0; i yVals = new ArrayList();
for (int i = 0; i
以上,就完成了一个折线图的打造,其实也就很简单,就三点
package com.test.demo.demo;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;
import java.util.ArrayList;
import butterknife.ButterKnife;
import butterknife.InjectView;
/**
* 作者:zengtao
* 邮箱:1039562669@qq.com
* 时间:2015/10/14 0014 10:05
*/
public class BarChartActivity extends AppCompatActivity {
@InjectView(R.id.barChart)
BarChart barChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bar_chart);
ButterKnife.inject(this);
initBarChart();
}
private void initBarChart() {
barChart.setDrawGridBackground(false);
barChart.setDrawBorders(false); //是否在折线图上添加边框
barChart.setDescription("");// 数据描述
barChart.setNoDataTextDescription("no data to display"); // 如果没有数据,显示
barChart.setDrawGridBackground(false); // 是否显示表格颜色
barChart.setGridBackgroundColor(Color.WHITE); // 表格的的颜色,在这里是是给颜色设置一个透明度
barChart.setTouchEnabled(false); // 设置是否可以触摸
barChart.setDragEnabled(false);// 是否可以拖拽
barChart.setScaleEnabled(false);// 是否可以缩放
barChart.setPinchZoom(false);//
barChart.setDrawBarShadow(true);
// 设置数据
BarData mBarData = getBarData(4);
barChart.setData(mBarData);
Legend mLegend = barChart.getLegend(); // 设置比例图标示
mLegend.setForm(Legend.LegendForm.CIRCLE);// 样式
mLegend.setFormSize(6f);// 字体
mLegend.setTextColor(Color.BLACK);// 颜色
// X轴设定
barChart.animateY(3000);
barChart.invalidate();
}
private BarData getBarData(int count) {
int[] yy = {60, 40, 80, 50};
ArrayList xValues = new ArrayList();
for (int i = 0; i yValues = new ArrayList();
for (int i = 0; i barDataSets = new ArrayList();
barDataSets.add(barDataSet); // add the datasets
BarData barData = new BarData(xValues, barDataSets);
return barData;
}
}
看到这里,你就会发现,折线图和统计图,基本上都是一个样子:
示例:
package com.test.demo.demo;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.DisplayMetrics;
import com.github.mikephil.charting.charts.PieChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.PieData;
import com.github.mikephil.charting.data.PieDataSet;
import java.util.ArrayList;
import butterknife.ButterKnife;
import butterknife.InjectView;
/**
* 作者:zengtao
* 邮箱:1039562669@qq.com
* 时间:2015/10/14 0014 10:05
*/
public class PieChartActivity extends AppCompatActivity {
@InjectView(R.id.pieChart)
PieChart pieChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_pie_chart);
ButterKnife.inject(this);
initPieChart();
}
private void initPieChart() {
pieChart.setDescription("BarChart Test");
pieChart.setHoleColorTransparent(true);
pieChart.setHoleRadius(60f); //半径
pieChart.setTransparentCircleRadius(0f); // 半透明圈
pieChart.setHoleRadius(0); //实心圆
pieChart.setDrawCenterText(true); //饼状图中间可以添加文字
pieChart.setDrawHoleEnabled(true);
pieChart.setRotationAngle(90); // 初始旋转角度
pieChart.setRotationEnabled(true); // 可以手动旋转
pieChart.setUsePercentValues(true); //显示成百分比
// pieChart.setCenterText("PieChart"); //饼状图中间的文字
//设置数据
PieData pieData = getPieData(6);
pieChart.setData(pieData);
Legend mLegend = pieChart.getLegend(); //设置比例图
mLegend.setPosition(Legend.LegendPosition.LEFT_OF_CHART_CENTER); //最左边显示
mLegend.setForm(Legend.LegendForm.SQUARE); //设置比例图的形状,默认是方形 SQUARE
mLegend.setXEntrySpace(7f);
mLegend.setYEntrySpace(5f);
pieChart.animateXY(1000, 1000); //设置动画
pieChart.invalidate();
}
private PieData getPieData(int count) {
int[] yy = {12, 12, 18, 20, 28, 10};
ArrayList xValues = new ArrayList(); //xVals用来表示每个饼块上的内容
for (int i = 0; i yValues = new ArrayList(); //yVals用来表示封装每个饼块的实际数据
for (int i = 0; i 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));
colors.add(Color.rgb(30, 20, 200));
colors.add(Color.rgb(80, 60, 150));
pieDataSet.setColors(colors);
DisplayMetrics metrics = getResources().getDisplayMetrics();
float px = 5 * (metrics.densityDpi / 160f);
pieDataSet.setSelectionShift(px); // 选中态多出的长度
PieData pieData = new PieData(xValues, pieDataSet);
return pieData;
}
}