Android统计图表MPAndroidChart



Android统计图表MPAndroidChart

MPAndroidChart是在Android平台上开源的第三方统计图表库,可以绘制样式复杂、丰富的各种统计图表,如一般常见的折线图、饼状图、柱状图、散点图、金融股票中使用的的“蜡烛”图、“泡泡”统计图、雷达状统计饼状图等等。简言之,AndroidMPChart基本上可以满足日常在Android平台上的统计图表开发需要。

AndroidMPChart在github上的项目主页: https://github.com/PhilJay/MPAndroidChart

在自己的项目的libs中,导入其发布的jar包即可使用MPAndroidChart。MPAndroidChart发布的jar包页面在: https://github.com/PhilJay/MPAndroidChart/releases

AndroidMPChart使用方法:在上面的releases页面下载最新的jar包,复制到自己的项目libs中即可使用。如图:

注:写作本文是基于MPAndroidChart的版本:mpandroidchartlibrary-2-1-3.jar

现在,先做一个基础的AndroidMPChart折线图,折线图在平时的统计图表中应用最多,AndroidMPChart提供了丰富的功能给予支持。

效果图如下:

现给出实现上述统计图表的全部代码。

MainActivity.java的代码:

package zhangphil.linechart;

import java.util.ArrayList;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.Legend.LegendForm;
import com.github.mikephil.charting.components.Legend.LegendPosition;
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.utils.ValueFormatter;

import android.support.v7.app.ActionBarActivity;
import android.graphics.Color;
import android.os.Bundle;

public class MainActivity extends ActionBarActivity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		LineChart chart = (LineChart) findViewById(R.id.chart);

		// 制作7个数据点(沿x坐标轴)
		LineData mLineData = makeLineData(7);
		setChartStyle(chart, mLineData, Color.WHITE);
	}

	// 设置chart显示的样式
	private void setChartStyle(LineChart mLineChart, LineData lineData,
			int color) {
		// 是否在折线图上添加边框
		mLineChart.setDrawBorders(false);

		mLineChart.setDescription("描述@ZhangPhil");// 数据描述

		// 如果没有数据的时候,会显示这个,类似listview的emtpyview
		mLineChart
				.setNoDataTextDescription("如果传给MPAndroidChart的数据为空,那么你将看到这段文字。@Zhang Phil");

		// 是否绘制背景颜色。
		// 如果mLineChart.setDrawGridBackground(false),
		// 那么mLineChart.setGridBackgroundColor(Color.CYAN)将失效;
		mLineChart.setDrawGridBackground(false);
		mLineChart.setGridBackgroundColor(Color.CYAN);

		// 触摸
		mLineChart.setTouchEnabled(true);

		// 拖拽
		mLineChart.setDragEnabled(true);

		// 缩放
		mLineChart.setScaleEnabled(true);

		mLineChart.setPinchZoom(false);

		// 设置背景
		mLineChart.setBackgroundColor(color);

		// 设置x,y轴的数据
		mLineChart.setData(lineData);

		// 设置比例图标示,就是那个一组y的value的
		Legend mLegend = mLineChart.getLegend();

		mLegend.setPosition(LegendPosition.BELOW_CHART_CENTER);
		mLegend.setForm(LegendForm.CIRCLE);// 样式
		mLegend.setFormSize(15.0f);// 字体
		mLegend.setTextColor(Color.BLUE);// 颜色

		// 沿x轴动画,时间2000毫秒。
		mLineChart.animateX(2000);
	}

	/**
	 * @param count
	 *            数据点的数量。
	 * @return
	 */
	private LineData makeLineData(int count) {
		ArrayList<String> x = new ArrayList<String>();
		for (int i = 0; i < count; i++) {
			// x轴显示的数据
			x.add("x:" + i);
		}

		// y轴的数据
		ArrayList<Entry> y = new ArrayList<Entry>();
		for (int i = 0; i < count; i++) {
			float val = (float) (Math.random() * 100);
			Entry entry = new Entry(val, i);
			y.add(entry);
		}

		// y轴数据集
		LineDataSet mLineDataSet = new LineDataSet(y, "测试数据集。by ZhangPhil");

		// 用y轴的集合来设置参数
		// 线宽
		mLineDataSet.setLineWidth(3.0f);

		// 显示的圆形大小
		mLineDataSet.setCircleSize(5.0f);

		// 折线的颜色
		mLineDataSet.setColor(Color.DKGRAY);

		// 圆球的颜色
		mLineDataSet.setCircleColor(Color.GREEN);

		// 设置mLineDataSet.setDrawHighlightIndicators(false)后,
		// Highlight的十字交叉的纵横线将不会显示,
		// 同时,mLineDataSet.setHighLightColor(Color.CYAN)失效。
		mLineDataSet.setDrawHighlightIndicators(true);

		// 按击后,十字交叉线的颜色
		mLineDataSet.setHighLightColor(Color.CYAN);

		// 设置这项上显示的数据点的字体大小。
		mLineDataSet.setValueTextSize(10.0f);

		// mLineDataSet.setDrawCircleHole(true);

		// 改变折线样式,用曲线。
		// mLineDataSet.setDrawCubic(true);
		// 默认是直线
		// 曲线的平滑度,值越大越平滑。
		// mLineDataSet.setCubicIntensity(0.2f);

		// 填充曲线下方的区域,红色,半透明。
		// mLineDataSet.setDrawFilled(true);
		// mLineDataSet.setFillAlpha(128);
		// mLineDataSet.setFillColor(Color.RED);

		// 填充折线上数据点、圆球里面包裹的中心空白处的颜色。
		mLineDataSet.setCircleColorHole(Color.YELLOW);

		// 设置折线上显示数据的格式。如果不设置,将默认显示float数据格式。
		mLineDataSet.setValueFormatter(new ValueFormatter() {

			@Override
			public String getFormattedValue(float value) {
				int n = (int) value;
				String s = "y:" + n;
				return s;
			}
		});

		ArrayList<LineDataSet> mLineDataSets = new ArrayList<LineDataSet>();
		mLineDataSets.add(mLineDataSet);

		LineData mLineData = new LineData(x, mLineDataSets);

		return mLineData;
	}
}

MainActivity.java需要的activity_main.xml :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

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

</RelativeLayout>

MPAndroidChart提供了丰富的参数设计条件,可以设计样式丰富统计图表,比如在本例中,如果把注释掉的这段代码重新启用:

// 改变折线样式,用曲线。
		// mLineDataSet.setDrawCubic(true);
		// 默认是直线
		// 曲线的平滑度,值越大越平滑。
		// mLineDataSet.setCubicIntensity(0.2f);

		// 填充曲线下方的区域,红色,半透明。
		// mLineDataSet.setDrawFilled(true);
		// mLineDataSet.setFillAlpha(128);
		// mLineDataSet.setFillColor(Color.RED);

那么折线图的样式就变成这样:

版权声明:本文为博主原创文章,未经博主允许不得转载。转载请注明出处:http://blog.csdn.net/zhangphil

时间: 2024-08-24 06:27:11

Android统计图表MPAndroidChart的相关文章

Android图表 MPAndroidChart折线图

1.介绍 MPAndroidChart GitHub地址 MPAndroidChart的强大之处就不在多说了,目前最新的版本是3.0.1,在新版本中很多方法都被弃用了,这个要注意一下,在网上查到的大多数资料都是关于旧版本的,今天来实现一下折线图,把过程记录下来,分享给大家. 效果图: 2.引入开源库 在项目根目录的build.gradle文件中加入如下代码 allprojects { repositories { maven { url "https://jitpack.io" } }

基于Android MPAndroidChart实现腾讯QQ群数据统计报表核心功能

 基于Android MPAndroidChart实现腾讯QQ群数据统计报表核心功能 腾讯QQ移动客户端(新版)的QQ群有一项功能比较有趣,是关于QQ群的.QQ群新增一项功能开放给具有管理权限的群成员:管理群 -> 群数据 中,会看到QQ群的一些基础数据统计报表,如人数.发言条数的统计报表,如图: 我之前写了一篇文章是关于Android平台上的一个统计报表的开源框架MPAndroidChart,文章介绍了如何在自己的项目中使用MPAndroidChart制作统计报表,同时给出了基本折线图的一

如何在 Swift 语言下使用 iOS Charts API 制作漂亮图表?

[编者按]本文作者 Joyce Echessa 是渥合数位服务创办人,毕业于台湾大学,近年来专注于协助客户进行 App 软体以及网站开发.文中作者通过示例介绍用 ios-charts 库创建简易美观的图表,有助于开发者在应用中生动形象地向用户展示数据.本文系 OneAPM 工程师编译整理: 呈现大量数据时,比起表格中一行行枯燥的数据,使用图表来形象地表示数据可以帮助用户更好地理解.在图表中,不需要通读所有数据资料,便能很容易地了解数据模式,从而获取关键信息.图表的使用在商业 App 和健身 Ap

统计图表--第三方开源--MPAndroidChart(一)

效果图1: 效果图2: MPAndroidChart是在Android平台上开源的第三方统计图表库,可以绘制样式复杂.丰富的各种统计图表,如一般常见的折线图.饼状图.柱状图.散点图.金融股票中使用的的“蜡烛”图.“泡泡”统计图.雷达状统计饼状图等等.简言之,AndroidMPChart基本上可以满足日常在Android平台上的统计图表开发需要.AndroidMPChart在github上的项目主页: https://github.com/PhilJay/MPAndroidChart 在自己的项目

Android图表库MPAndroidChart(十四)——在ListView种使用相同的图表

Android图表库MPAndroidChart(十四)--在ListView种使用相同的图表 各位好久不见,最近挺忙的,所有博客更新的比较少,这里今天说个比较简单的图表,那就是在ListView中使用相同的图标,因为我们在下篇会讲解使用不同的图表,相同的图表还是比较简单的,我们来看下效果图 具体怎么去实现呢,这里我们先写点铺垫,比如我们需要一个基类的Activity ViewPagerBaseActivity package com.liuguilin.mpandroidchartsample

Android图表库MPAndroidChart(十一)——多层级的堆叠条形图

Android图表库MPAndroidChart(十一)--多层级的堆叠条形图 事实上这个也是条形图的一种扩展,我们看下效果就知道了 是吧,他一般满足的需求就是同类数据比较了,不过目前我还真没看过哪个app有这样的图表,但是并不代表我们不能实现呀对吧,我们来看下基本实现 一.基本实现 看下我们的layout是怎么定义的 <com.github.mikephil.charting.charts.BarChart android:id="@+id/mBarChart" android

Android图表库MPAndroidChart(六)——换一种思考方式,水平条形图的实现过程

Android图表库MPAndroidChart(六)--换一种思考方式,水平条形图的实现过程 一.基本实现 我们之前实现了条形图,现在来看下水平条形图是怎么实现的,说白了就是横起来,看下效果: 说起来现在写着博客就轻松很多了,大家对MPAndroidChart的大部分流程已经很熟悉了,我们先layout里面定义它的横向View <com.github.mikephil.charting.charts.HorizontalBarChart android:id="@+id/mHorizon

Android图表库MPAndroidChart(三)——双重轴线形图的实现,这次就so easy了

Android图表库MPAndroidChart(三)--双重轴线形图的实现,这次就so easy了 承上启下,当我们学习完这篇 Android图表库MPAndroidChart(二)--线形图的方方面面,看完你会回来感谢我的 之后,你对MPAndroidChart的套路应该是有一定的了解了,用来用去就是那么几个不断的扩展,那我们今天扩展一下双轴的图标,什么是双轴呢?就是两个x或者两个y轴,看图 为了形成鲜明的对比,我把背景设置成黑色的了,我们来看下这个我们应该怎么去实现? 一.基本实现 这里布

Android图表库MPAndroidChart(二)——线形图的方方面面,看完你会回来感谢我的

Android图表库MPAndroidChart(二)--线形图的方方面面,看完你会回来感谢我的 我们继续来就学习,我是强烈建议看本篇之前先看我的上一篇 Android图表库MPAndroidChart(一)--了解他的本质,方能得心应手 我们这里来实现它的折线图,也就是我们的第一个图形,我们先来看下运行后的结果: 我们一步一步来分析他是怎么实现的,首先,我们要分析他组成的元素一共是多少有多少,我们抛开基本控件Button之外,我们算了算 x轴(最大/最小值 颜色 高宽等) Y轴(最大/最小值