1.介绍

MPAndroidChart GitHub地址 

MPAndroidChart的强大之处就不在多说了，目前最新的版本是3.0.1，在新版本中很多方法都被弃用了，这个要注意一下，在网上查到的大多数资料都是关于旧版本的，今天来实现一下折线图，把过程记录下来，分享给大家。

效果图：

2.引入开源库

在项目根目录的build.gradle文件中加入如下代码

allprojects {
  repositories {
    maven { url "https://jitpack.io" }
  }
}

在app根目录的buil.gradle文件中加入依赖

dependencies {
  compile 'com.github.PhilJay:MPAndroidChart:v3.0.1'
}

3.实现

在项目中，我把图表相关的功能抽取成了一个工具类ChartUtils。

初始化图表

initChart方法用来设置图表的功能和显示的样式，方法中注释了缩放和动画的代码，如果要使用动画，则不需要调用图表的invalidate方法。

/**
 * 初始化图表
 *
 * @param chart 原始图表
 * @return 初始化后的图表
 */
public static LineChart initChart(LineChart chart) {
  // 不显示数据描述
  chart.getDescription().setEnabled(false);
  // 没有数据的时候，显示“暂无数据”
  chart.setNoDataText("暂无数据");
  // 不显示表格颜色
  chart.setDrawGridBackground(false);
  // 不可以缩放
  chart.setScaleEnabled(false);
  // 不显示y轴右边的值
  chart.getAxisRight().setEnabled(false);
  // 不显示图例
  Legend legend = chart.getLegend();
  legend.setEnabled(false);
  // 向左偏移15dp，抵消y轴向右偏移的30dp
  chart.setExtraLeftOffset(-15);

  XAxis xAxis = chart.getXAxis();
  // 不显示x轴
  xAxis.setDrawAxisLine(false);
  // 设置x轴数据的位置
  xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
  xAxis.setTextColor(Color.WHITE);
  xAxis.setTextSize(12);
  xAxis.setGridColor(Color.parseColor("#30FFFFFF"));
  // 设置x轴数据偏移量
  xAxis.setYOffset(-12);

  YAxis yAxis = chart.getAxisLeft();
  // 不显示y轴
  yAxis.setDrawAxisLine(false);
  // 设置y轴数据的位置
  yAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
  // 不从y轴发出横向直线
  yAxis.setDrawGridLines(false);
  yAxis.setTextColor(Color.WHITE);
  yAxis.setTextSize(12);
  // 设置y轴数据偏移量
  yAxis.setXOffset(30);
  yAxis.setYOffset(-3);
  yAxis.setAxisMinimum(0);

  //Matrix matrix = new Matrix();
  // x轴缩放1.5倍
  //matrix.postScale(1.5f, 1f);
  // 在图表动画显示之前进行缩放
  //chart.getViewPortHandler().refresh(matrix, chart, false);
  // x轴执行动画
  //chart.animateX(2000);
  chart.invalidate();
  return chart;
}

设置图表数据

setChartData方法用来设置图表显示的数据，以及折线的属性。

/**
 * 设置图表数据
 *
 * @param chart 图表
 * @param values 数据
 */
public static void setChartData(LineChart chart, List<Entry> values) {
  LineDataSet lineDataSet;

  if (chart.getData() != null && chart.getData().getDataSetCount() > 0) {
    lineDataSet = (LineDataSet) chart.getData().getDataSetByIndex(0);
    lineDataSet.setValues(values);
    chart.getData().notifyDataChanged();
    chart.notifyDataSetChanged();
  } else {
    lineDataSet = new LineDataSet(values, "");
    // 设置曲线颜色
    lineDataSet.setColor(Color.parseColor("#FFFFFF"));
    // 设置平滑曲线
    lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
    // 不显示坐标点的小圆点
    lineDataSet.setDrawCircles(false);
    // 不显示坐标点的数据
    lineDataSet.setDrawValues(false);
    // 不显示定位线
    lineDataSet.setHighlightEnabled(false);

    LineData data = new LineData(lineDataSet);
    chart.setData(data);
    chart.invalidate();
  }
}

更新图表

notifyDataSetChanged方法用来更新图表，可以动态的显示x轴标签。

/**
 * 更新图表
 *
 * @param chart   图表
 * @param values  数据
 * @param valueType 数据类型
 */
public static void notifyDataSetChanged(LineChart chart, List<Entry> values,
                    final int valueType) {
  chart.getXAxis().setValueFormatter(new IAxisValueFormatter() {
    @Override
    public String getFormattedValue(float value, AxisBase axis) {
      return xValuesProcess(valueType)[(int) value];
    }
  });

  chart.invalidate();
  setChartData(chart, values);
}

x轴数据处理

xValuesProcess方法用于处理x轴数据。

x轴可以显示三种类型的数据，分别是今日数据、本周数据、本月数据。

/**
 * x轴数据处理
 *
 * @param valueType 数据类型
 * @return x轴数据
 */
private static String[] xValuesProcess(int valueType) {
  String[] week = {"周日", "周一", "周二", "周三", "周四", "周五", "周六"};

  if (valueType == dayValue) { // 今日
    String[] dayValues = new String[7];
    long currentTime = System.currentTimeMillis();
    for (int i = 6; i >= 0; i--) {
      dayValues[i] = TimeUtils.dateToString(currentTime, TimeUtils.dateFormat_day);
      currentTime -= (3 * 60 * 60 * 1000);
    }
    return dayValues;

  } else if (valueType == weekValue) { // 本周
    String[] weekValues = new String[7];
    Calendar calendar = Calendar.getInstance();
    int currentWeek = calendar.get(Calendar.DAY_OF_WEEK);

    for (int i = 6; i >= 0; i--) {
      weekValues[i] = week[currentWeek - 1];
      if (currentWeek == 1) {
        currentWeek = 7;
      } else {
        currentWeek -= 1;
      }
    }
    return weekValues;

  } else if (valueType == monthValue) { // 本月
    String[] monthValues = new String[7];
    long currentTime = System.currentTimeMillis();
    for (int i = 6; i >= 0; i--) {
      monthValues[i] = TimeUtils.dateToString(currentTime, TimeUtils.dateFormat_month);
      currentTime -= (4 * 24 * 60 * 60 * 1000);
    }
    return monthValues;
  }
  return new String[]{};
}

在Activity中使用

ChartUtils.initChart(chart);
ChartUtils.notifyDataSetChanged(chart, getData(), ChartUtils.dayValue);

布局文件

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

4.遇到的问题

• 在设置x轴水平方向平移时，xAxis.setXOffset()方法不起作用，这让我研究了好长时间，最后无奈使用图表平移方法chart.setExtraLeftOffset()来抵消y轴的平移，已经提交到了Issues上，有解答会在博客中更新。
• 目前y轴数据只能通过设置最大值、最小值、显示个数的方式来显示数据（如果不设置会自动计算），还没有找到自定义显示数据的方法，有了解的小伙伴可以留言告诉我啊。
• 自定义x轴数据的时候记得要算好对应的值，Demo中只用到了7个点，所以比较简单，但是x轴数据比较多的话，就要算一下了，如果有不懂的地方可以给我留言或者发私信。

5.写在最后

在实现的过程中，MPAndroidChart的Issues帮了不少忙，有很多人和我遇到了同样的问题，原来没有查阅Issues的习惯，又get新技能一枚。

官方文档

完整的Demo下载

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# mpandroidchart折线图  # android开源折线图表  # android折线图开源库  # MPAndroidChart开源图表库的使用介绍之饼状图、折线图和柱状图  # Android MPAndroidChart开源库图表之折线图的实例代码  # Android自定义View实现折线图效果  # Android绘制动态折线图  # Android HelloChart开源库图表之折线图的实例代码  # Android开发之天气趋势折线图  # Android自定义控件实现折线图  # Android自定义可左右滑动和点击的折线图  # Android自定义View简易折线图控件（二）  # Android开发RecyclerView实现折线图效果  # 暂无  # 数据处理  # 自定义  # 都是  # 本周  # 今日  # 还没有  # 成了  # 偏移量  # 不需要  # 和我  # 之处  # 很多人  # 不可以  # 不懂  # 下了  # 会在  # 坐标点  # 我把  # 要注意 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： 如何在万网自助建站中设置域名及备案？  如何用腾讯建站主机快速创建免费网站？  ChatGPT怎么生成Excel公式_ChatGPT公式生成方法【指南】  JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)  活动邀请函制作网站有哪些,活动邀请函文案？  怎么制作网站设计模板图片,有电商商品详情页面的免费模板素材网站推荐吗？  php在windows下怎么调试_phpwindows环境调试操作说明【操作】  Laravel如何使用Seeder填充数据_Laravel模型工厂Factory批量生成测试数据【方法】  Laravel如何实现文件上传和存储？（本地与S3配置）  Linux网络带宽限制_tc配置实践解析【教程】  海南网站制作公司有哪些,海口网是哪家的？  Laravel如何使用.env文件管理环境变量？（最佳实践）  Laravel怎么集成Log日志记录_Laravel单文件与每日日志配置及自定义通道【详解】  Laravel Seeder填充数据教程_Laravel模型工厂Factory使用  Laravel怎么使用Markdown渲染文档_Laravel将Markdown内容转HTML页面展示【实战】  手机怎么制作网站教程步骤,手机怎么做自己的网页链接？  Android使用GridView实现日历的简单功能  如何用PHP快速搭建CMS系统？  香港服务器网站生成指南：免费资源整合与高速稳定配置方案  Python进程池调度策略_任务分发说明【指导】  米侠浏览器网页背景异常怎么办 米侠显示修复  网站制作大概要多少钱一个,做一个平台网站大概多少钱？  如何用搬瓦工VPS快速搭建个人网站？  如何快速上传建站程序避免常见错误？  弹幕视频网站制作教程下载,弹幕视频网站是什么意思？  高性能网站服务器部署指南：稳定运行与安全配置优化方案  iOS验证手机号的正则表达式  Laravel如何实现多级无限分类_Laravel递归模型关联与树状数据输出【方法】  如何将凡科建站内容保存为本地文件？  html5的keygen标签为什么废弃_替代方案说明【解答】  Laravel Eloquent：优雅地将关联模型字段扁平化到主模型中  canvas 画布在主流浏览器中的尺寸限制详细介绍  Laravel如何与Docker（Sail）协同开发？（环境搭建教程）  网站制作价目表怎么做,珍爱网婚介费用多少？  Laravel如何发送系统通知？（Notification渠道示例）  Laravel如何理解并使用服务容器（Service Container）_Laravel依赖注入与容器绑定说明  公司门户网站制作流程,华为官网怎么做？  如何在阿里云域名上完成建站全流程？  Laravel的契約(Contracts)是什么_深入理解Laravel Contracts与依赖倒置  网站广告牌制作方法,街上的广告牌，横幅，用PS还是其他软件做的？  为什么php本地部署后css不生效_静态资源加载失败修复技巧【技巧】  独立制作一个网站多少钱,建立网站需要花多少钱？  Java垃圾回收器的方法和原理总结  如何续费美橙建站之星域名及服务？  学生网站制作软件,一个12岁的学生写小说，应该去什么样的网站？  laravel怎么使用数据库工厂（Factory）生成带有关联模型的数据_laravel Factory生成关联数据方法  如何做网站制作流程,*游戏网站怎么搭建？  Laravel怎么发送邮件_Laravel Mail类SMTP配置教程  Laravel如何实现本地化和多语言支持？（i18n教程）  如何在HTML表单中获取用户输入并结合JavaScript动态控制复利计算循环