Android图表开发---MPAndroidChart

news2024/12/27 9:45:09

本章内容主要是MPAndroidChart开源框架中的LineChart

api 'com.github.PhilJay:MPAndroidChart:v3.1.0'
<com.github.mikephil.charting.charts.LineChart
    android:id="@+id/lineChart"
    android:layout_width="match_parent"
    android:layout_height="330dp" />

设置图表

设置图表内容与图表控件的上下左右间距用

setExtraTopOffset,setExtraBottomOffset,setExtraLeftOffset,setExtraRightOffset

开启图表内容滑动(缩放之后)

setTouchEnabled

设置图表绘制时长(图表内容比较多时可以酌情设置大一些,给数据处理一个缓冲时间)

animateX

设置XY轴一起放大(如果XY轴的内容相关性比较强,可以设置,如果两者内容比较独立,可设置各自缩放)

setPinchZoom

设置Y轴显示在哪边(左右)

getAxisLeft,getAxisRight  //赋值为true则打开

设置线条说明(有多条曲线时可能需要对每个曲线做一个说明)

getLegend得到绘制的整个组件
getLegend().setForm  //设置说明的图标样式(空,方形,圆形,线条)
getLegend().setVerticalAlignment //设置说明组件水平的位置
getLegend().setHorizontalAlignment // //设置说明组件垂直的位置

以上两个可以确定位置(左上,右上,左下,右下,左中,右中,居中)

Legend.LegendVerticalAlignment.BOTTOM(TOP, CENTER, BOTTOM)
Legend.LegendHorizontalAlignment.RIGHT(LEFT, CENTER, RIGHT)
getLegend().setOrientation  //设置说明文字的显示方向(横竖)
getLegend().setXOffset   //设置说明文字与X轴间距
getLegend().setYOffset  //设置说明文字与Y轴间距
getLegend().setDrawInside  //设置说明文字显示到图表内部还是外部

设置X轴getXAxis

getXAxis().setAxisMaximum  //设置X轴的最大值
getXAxis().setAxisMinimum  //设置X轴的最小值
getXAxis().setGranularity  //设置X轴值的密度(放到最大之后每个值的差值)
getXAxis().setPosition  //设置X轴的位置(TOP, BOTTOM, BOTH_SIDED, TOP_INSIDE, BOTTOM_INSIDE)
getXAxis().setDrawGridLines //是否绘制X轴的网格线(网格线垂直于X轴,平行于Y轴)
getXAxis().setAxisLineColor  //设置X轴线条的颜色
getXAxis().setLabelCount(7, false) //设置X轴最多显示几个刻度值,缩放都不会影响显示的个数(后面的bool值控制是否强制显示这么多个数,true滑动时会有刻度和线条中的数据对不齐的可能,false时会有显示的刻度个数小于设置值的可能,比如设置为7,可能只能显示6个)
getXAxis().setDrawAxisLine   //是否绘制X轴
getXAxis().setValueFormatter  //设置显示在X轴上的刻度(如果要显示星期,X轴的数据为1,2,3...,7,显示出来的数据为星期1,2,3,...7)

设置Y轴getAxisLeft或者getAxisRight

getAxisLeft().enableGridDashedLine  //设置网格线(虚线)
getAxisLeft().setDrawGridLines   //开启网格线,这里如果不开,则虚线使能开关无效
getAxisLeft().setGranularityEnabled //设置Y轴固定间隔

设置高亮文字弹窗

markerView.setChartView(lineChart)  //MarkerView初始化时传入弹窗布局
setMarker(markerView)
val tfLight = context.resources.getFont(自定义文字样式)
lineChart?.apply {
    //X轴在底部,与chart底部的距离(如果需要底部文字对图标进行说明,则可能会用到该值)
    //extraBottomOffset = if (isLegend) 50f else 20f
    extraBottomOffset = 20f
    extraTopOffset = if (isLegend) 30f else 0f
    //是否开启触摸监听
    setTouchEnabled(isLegend)
    dragDecelerationFrictionCoef = 0.9f
    isDragEnabled = true
    //开启缩放功能
    setScaleEnabled(true)
    //绘制网格线的背景
    setDrawGridBackground(false)
    //setPinchZoom(true)
    //绘制动画的总时长
    animateX(500)
    //是否开启右边Y轴
    axisRight?.isEnabled = false
    //设置图标的标题
    setNoDataText("")
    //设置X轴底部文字和图标样式
    legend?.apply {
        //X轴底部对线条说明的样式(方形,或者圆形等)
        form = Legend.LegendForm.CIRCLE
        //X轴底部文字说明的样式
        typeface = tfLight
        textSize = 11f
        textColor = Color.WHITE
        //X轴底部文字说明的位置(横向和竖向)
        verticalAlignment = Legend.LegendVerticalAlignment.BOTTOM
        horizontalAlignment = Legend.LegendHorizontalAlignment.RIGHT
        //底部文字说明的方向
        orientation = Legend.LegendOrientation.HORIZONTAL
        //底部文字说明与X轴的间距
        yOffset = 10f
        //是否开启X轴说明
        //isEnabled = isLegend
        isEnabled = false
        //是否绘制在图标内部
        setDrawInside(true)
    }
    xAxis?.apply {
        //X轴文字样式
        typeface = tfLight
        textSize = 11f
        textColor = Color.parseColor("#FF5E668A")
        //X轴最大值和最小值
        axisMaximum = System.currentTimeMillis() / DAY_MILLS + 3f
        axisMinimum = System.currentTimeMillis() / DAY_MILLS - 3f
        //X轴每个值的差值(缩放时可以体现出来)
        granularity = 1f
        //X轴的位置
        position = XAxis.XAxisPosition.BOTTOM
        //是否绘制X轴的网格线(垂直于X轴)
        setDrawGridLines(false)
        //X轴的颜色
        axisLineColor = Color.parseColor("#FFD8E5FA")
        //X轴的宽度
        axisLineWidth = 2f
        //设置X轴显示固定条目,放大缩小都显示这个数
        setLabelCount(7, false)
        //是否绘制X轴
        setDrawAxisLine(!isLegend)
        //X轴每个刻度对应的值(展示的值和设置的值不同)
        valueFormatter = object : ValueFormatter() {
            override fun getFormattedValue(value: Float): String {
                return SimpleDateFormat(
                    "MM.dd",
                    Locale.getDefault()
                ).format(Date(value.toLong() * DAY_MILLS))
            }
        }
    }
    axisLeft?.apply {
        //左侧Y轴文字样式
        typeface = tfLight
        textColor = Color.parseColor("#FF5E668A")
        //左侧Y轴的最大值和最小值
        axisMaximum = if (type == 0) 210f else 150f
        axisMinimum = 30f
        //绘制网格线(样式虚线)
        enableGridDashedLine(15f, 8f, 0f)
        gridColor = Color.parseColor("#4F9FB1FF")
        gridLineWidth = 1f
        axisLineColor = Color.parseColor("#FFD8E5FA")
        axisLineWidth = 2f
        setDrawGridLines(isLegend)
        setDrawAxisLine(!isLegend) //绘制左边Y轴是否显示
        setDrawZeroLine(false) //是否开启0线
        isGranularityEnabled = true
    }
    //设置选中时的文字提示
    val markerView = eMarkerView(context, R.layout.view_chart_mark)
    markerView.chartView = lineChart
    marker = markerView
    //拦截事件,防止有父布局中有其他滑动事件,引起滑动冲突
    setOnTouchListener { _, event ->
        parent.requestDisallowInterceptTouchEvent(true)
        onTouchEvent(event)
    }
}

 设置X轴Y轴的说明

比如身高(cm)这样的说明

val description = Description()
description.text = desText
description.textSize = 11f
description.textColor = Color.parseColor("#FF5E668A")
description.textAlign = Paint.Align.LEFT
description.setPosition(30f, 50f) //设置某一个轴的单位
lineChart?.description = description

setPosition就是设置显示说明文字位置,需要自己根据图表控件的大小,获取到相对的坐标点

这里的坐标点,需要转换成以图表控件为坐标体系的坐标值,否则可能显示不出来

设置数据

getViewPortHandler().setMaximumScaleX //设置X轴最大缩放倍数

getViewPortHandler().setMaximumScaleY  //设置Y轴最大缩放倍数

zoom(maxOfx, 0f, 0f, 0f)  //设置某个轴或者值的放大倍数
val values = ArrayList<Entry>()
list?.forEach {
    values.add(Entry(xValue, yValue))
}
lineChart?.apply {
    var maxOfx = 1f
    viewPortHandler.setMaximumScaleX(maxOfx)
    viewPortHandler.setMaximumScaleY(4f)
    zoom(maxOfx, 0f, 0f, 0f)
}
val dataSet = LineDataSet(values, chartDesText).apply {
    val valuePointColor =Color.parseColor("#FF00BCC6")
    color = valuePointColor  //线条的颜色
    setCircleColor(valuePointColor) //关键点的圆点颜色
    setDrawCircles(true)
    setDrawVerticalHighlightIndicator(true)   //点击的时候出现竖线
    setDrawHorizontalHighlightIndicator(false)   //点击的时候出现横线
    enableDashedHighlightLine(15f, 5f, 0f)
    //选中的高亮竖线颜色
    highLightColor = Color.parseColor(#FF00BCC6)
    lineWidth = 2f
    circleRadius = 3f
    fillAlpha = 65
    fillColor = ColorTemplate.getHoloBlue()
    setDrawCircleHole(false)
    isHighlightEnabled = true
}
val lineData = LineData(dataSet).apply {
    setDrawValues(false)  //是否绘制每个点的数值
    setValueTextColor(Color.WHITE)
    setValueTextSize(9f)
}
lineChart?.apply {
    data = lineData
    //移动标记点到坐标轴中间
    centerViewTo(values.last().x, values.last().y, YAxis.AxisDependency.LEFT)
    //选中某个点
    highlightValue(values.last().x, 0)
}

PS:

在有很多数据,并且放大到最大时,如果想要默认移动到某个值可以用

centerViewTo(values.last().x, values.last().y, YAxis.AxisDependency.LEFT)

选中某个点并高亮可以用

highlightValue(values.last().x, 0)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/985150.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

飞机降落(dfs全排列)

4957. 飞机降落 - AcWing题库 数据量很小&#xff0c;直接爆搜 #include<bits/stdc.h> using namespace std; const int N20; int n,t,flag,st[N];//st记录是否已经降落&#xff0c;flag标记是否降落完成 struct Node {int t,d,l; }node[N]; void dfs(int u,int last)/…

使用Flask-Restful后handle_error干扰无法正常捕获全局异常的解决

1、发现问题 1.1、追踪Api源码&#xff0c;vscode举例&#xff0c;右键点击Api&#xff0c;选择转到定义&#xff0c;确定flask_restful包的位置 from flask_restful import Api1.2、vscode 打开flask_restful包作为一个项目 1.3、之前的问题是&#xff0c;抛出的HTTPExceptio…

无涯教程-JavaScript - BESSELY函数

描述 BESSELY函数针对x的指定顺序和值返回Bessel函数Yn(x)(也称为Weber函数或Neumann函数)。 语法 BESSELY(X, N)争论 Argument描述Required/OptionalXThe value at which to evaluate the function.RequiredNThe order of the function. If n is not an integer, it is tr…

数据结构与算法之字符串

文章目录 1.字符串定义2.串的几个基本概念2.1 空串:2.2空格串2.3子串2.4串相等2.5串比较 3.串的基本操作(此处以java为例)3.1赋值操作StrAssign(s,t)3.2 连接操作 Concat(s,t)3.3求串长StrLength(s)3.4比较StrCompare(st)3.5 求子串_SubString(s,start,len) 4.串的存储结构4.1 …

j解决Ubuntu无法安装pycairo和PyGObject

环境&#xff1a;虚拟机Ubuntu20.04&#xff0c;vscode无法安装pycairo和PyGObject 虚拟机Ubuntu20.04&#xff0c;vscode中运行Anaconda搭建的vens 的Python3.8.10 首先在vscode中点击ctrlshiftp&#xff0c;选择Python3.8.10的环境&#xff0c;自动激活Python 最近在搞无人…

基于SSM的人才招聘系统

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;采用JSP技术开发 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#x…

WorkPlus打造统一用户管理平台,实现企业用户管理的一体化

在企业信息化的进程中&#xff0c;统一用户管理平台扮演着重要的角色。WorkPlus作为领先的品牌&#xff0c;致力于打造一体化的统一用户管理平台&#xff0c;帮助企业实现用户管理的便捷与高效。本文将重点介绍WorkPlus如何通过创新的解决方案&#xff0c;实现企业用户管理的统…

unity fbx动画按配置切割帧片段

主要参考该文章&#xff1a;人无两度s 《unity自动切割动画》 感谢作者分享 执行代码需要将模型与配置文件(.txt)放到同一目录下&#xff0c;批量选中模型后右键&#xff0c;代码中读取了选中的第一个模型同目录下可能存在的“动画帧分段.txt”&#xff0c;按其中的配置对选中…

[HNCTF 2022 Week1]——Web方向 详细Writeup

Week1 [HNCTF 2022 Week1]2048 f12查看源代码 可以看出游戏的分数是score 修改score的值 得到flag [HNCTF 2022 Week1]Interesting_include 得到源码 <?php //WEB手要懂得搜索 //flag in ./flag.phpif(isset($_GET[filter])){$file $_GET[filter];if(!preg_match(&qu…

axios封装/基础配置

步骤&#xff1a;装包 -> 封装axios实例 ->调用实例发送请求 1. 装包 npm install axios 2. 封装 axios基础配置 // axios实例封装 import axios from axios// 创建axios实例 const axiosInstance axios.create({baseURL:http://xxx.net, //基地址timeout:5000 //…

el-table 实现表、表格行、表格列合并

最近写vue开发项目的时候&#xff0c;很多地方用到了Element组件中的Table 表格。经过一周的边学边做&#xff0c;我总结了以下三种有关表格的合并方法。 一、合并表头 话不多说&#xff0c;先看效果图 代码如下&#xff1a; 表格结构如上&#xff0c;其中:header-cell-style对…

Java进行多线程编程?(lambda表达式~)

本文标题&#xff1a;Java进行多线程编程&#xff1f;那么&#xff0c;Java为啥不学学如何进程多进程编程呢&#xff1f;&#xff1f;原因在于&#xff1a;Java圈子中不提倡多进程编程~~ 接下来&#xff0c;我们来写一个最为基础/入门的HelloWord程序来感受如何进行多线程~~ J…

数据资产管理:数据目录怎么搞?

经过了站在业务视角的自上而下的数据梳理&#xff0c;以及站在IT视角的自下而上的数据盘点&#xff0c;一套“热腾腾”的数据资产清单终于新鲜出炉了。 通过数据资产盘点&#xff0c;企业终于知道他们拥有哪些数据、如何使用数据、是否安全以及数据在哪里。 然而&#xff0c;据…

数据库误修改后的数据恢复

一不小心将数据库数据修改了&#xff0c;而且回滚无效&#xff0c;于是去尝试各种方法恢复数据 查询到修改时间点之前的数据 恢复数据 恢复数据库被修改数据的流程及代码&#xff0c;这里被修改的表是AUTH_USER,实际应用填写对应表名。 -- 通过时间恢复删除且已提交的数据-- 1…

Jenkins安装配置及插件安装使用

个人理解持续集成&#xff1a;为解决程序代码提交质量低,提交内容导致原有系统的BUG&#xff0c;按时或按需自动编译版本&#xff0c;进行自动化测试。 百度对持续集成的定义&#xff1a;持续集成是一种软件开发实践&#xff0c;即团队开发成员经常集成他们的工作&#xff0c;…

配额 安排

一 常用Tcode 基于Tcode的顺序排列 供应商主数据物料主数据货源清单配额安排采购信息记录采购订单框架协议采购询价/报价采购申请订单收货发票校验物料需求计划BP-供应商主数据MM01 - 物料主数据新增ME01 - 维护MEQ1 - 维护ME11 - 创建ME21N - 创建框架协议-合同&#xff1a…

Qt6_贪吃蛇Greedy Snake

贪吃蛇Greedy Snake 1分析 首先这是一个贪吃蛇界面&#xff0c;由一个长方形边框和一只贪吃蛇组成 默认开局时&#xff0c;贪吃蛇身体只有3个小方块&#xff0c;使用画笔画出 1.1如何移动 对于蛇的移动&#xff0c;有2种方法 在一定时间范围内(定时器)&#xff0c;未对游戏…

谷歌 reCAPTCHA 人机验证

一、问题 smogon 论坛注册不成功。输入账号、密码、邮箱后显示 You did not complete the CAPTCHA verification properly. Please try again. 即未通过 CAPTCHA 验证。 二、原因 使用的 CAPTCHA 验证是谷歌的 reCAPTCHA 人机验证&#xff0c;国内无法访问谷歌服务。 三、解决…

分页查询实现

目录 1.实体类 2.Mapper层 2.1.xxxMapper接口 2.2.xxxMapper.xml文件 3.Service层 3.1.xxxService接口 3.2.xxxServiceImpl层 4.xxxController层 5.调用接口 6.总结 1.实体类 与数据库交互和与前端交互的实体类 这个Model是与数据库交互的实体类&#xff0c;其中的…

python调用GPT实现:智能用例生成工具

工具作用&#xff1a; 根据输入的功能点&#xff0c;生成通用测试点 实现步骤 工具实现主要分2个步骤&#xff1a; 1.https请求调用Gpt,将返回响应结果保存为.md文件 2.用python实现 将 .md文件转换成.xmind文件 3.写个简单的前端页面&#xff0c;调用上述步骤接口 详细代…