Android 图表开源框架之MPAndroidChart LineChart折线图(三)

2023-11-29 08:58

本文主要是介绍Android 图表开源框架之MPAndroidChart LineChart折线图(三),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

Android 图表开源框架之MPAndroidChart LineChart折线图(一)

Android 图表开源框架之MPAndroidChart LineChart折线图(二)

Android 图表开源框架之MPAndroidChart LineChart之常用自定义设置功能

源码下载地址:MPAndroidChart3_0_1.zip  https://mp.csdn.net/console/upDetailed

      Android 图表开源框架之MPAndroidChart LineChart折线图,v3.0.1版本,MPAndroidChart是一款基于Android的开源图表库,MPAndroidChart不仅可以在Android设备上绘制各种统计图表,而且可以对图表进行拖动和缩放操作,应用起来非常灵活。MPAndroidChart显得更为轻巧和简单,拥有常用的图表类型:线型图、饼图、柱状图和散点图。
 

一.效果图:

 

 

 

二.快速实现:

implementation 'com.github.PhilJay:MPAndroidChart:v3.0.1'

1.主函数代码:

import android.content.Context;
import android.content.Intent;
import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.text.format.DateFormat;
import android.util.DisplayMetrics;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;import com.example.m1571.mympandroidchart.utils.CustomXValueFormatter;
import com.example.m1571.mympandroidchart.utils.MyMarkerView;
import com.example.m1571.mympandroidchart.utils.MyMarkersView;
import com.github.mikephil.charting.animation.Easing;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.charts.PieChart;
import com.github.mikephil.charting.components.AxisBase;
import com.github.mikephil.charting.components.Description;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.LimitLine;
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.github.mikephil.charting.data.PieEntry;
import com.github.mikephil.charting.formatter.IAxisValueFormatter;
import com.github.mikephil.charting.formatter.PercentFormatter;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.listener.OnChartValueSelectedListener;
import com.github.mikephil.charting.utils.ColorTemplate;import java.util.ArrayList;
import java.util.Collections;
import java.util.HashMap;
import java.util.List;
import java.util.Map;/**** 图表开源框架* https://blog.csdn.net/qq_43332570/article/details/103180779**https://blog.csdn.net/qq_26787115/article/details/53611373*** https://www.jb51.net/article/142778.htm* https://www.jb51.net/article/141344.htm* https://www.jb51.net/article/96508.htm* <p>* https://github.com/hdodenhof/CircleImageView*/
public class ChartActivity extends AppCompatActivity {ArrayList<PieEntry> pieEntryList = new ArrayList();//数据列表ArrayList<Integer> colors = new ArrayList();//颜色列表private LineChart lineChart;float datas[] = {14f,15f,16f,17f,16f,16f};float datas2[] = {17f,16f,15f,14f,17f,14f};//在MPAndroidChart一般都是通过List<Entry>对象来装数据的final List<Entry> entries = new ArrayList<Entry>();final List<Entry> entries2 = new ArrayList<Entry>();final List<String> yRightList = new ArrayList<String>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_chart);lineChart = (LineChart) findViewById(R.id.lineChart);List<Integer> mylist = new ArrayList<>();
//        for (int i = 0; i < 10; i++) {
//            mylist.add(i);
//        }mylist.add(1);mylist.add(8);mylist.add(3);mylist.add(7);mylist.add(2);mylist.add(8);mylist.add(5);mylist.add(0);mylist.add(1);mylist.add(6);setData(mylist);//解决滑动冲突
//        lineChart.setOnTouchListener(new View.OnTouchListener()
//        {
//            @Override
//            public boolean onTouch(View v, MotionEvent event)
//            {
//                switch (event.getAction())
//                {
//                    case MotionEvent.ACTION_DOWN:
//                    {
//                        scrollview.requestDisallowInterceptTouchEvent(true);
//                        break;
//                    }
//                    case MotionEvent.ACTION_CANCEL:
//                    case MotionEvent.ACTION_UP:
//                    {
//                        scrollview.requestDisallowInterceptTouchEvent(false);
//                        break;
//                    }
//                }
//                return false;
//            }
//        });}
/*** 初始化曲线图表** @param list 数据集*/public void setData(final List<Integer> list){//显示边界lineChart.setDrawBorders(false);//设置数据List<Entry> entries = new ArrayList<>();for (int i = 0; i < list.size(); i++){entries.add(new Entry(i, (float) list.get(i)));}//一个LineDataSet就是一条线LineDataSet lineDataSet = new LineDataSet(entries, "sgf");//线颜色lineDataSet.setColor(Color.parseColor("#F15A4A"));//线宽度lineDataSet.setLineWidth(1.6f);//不显示圆点lineDataSet.setDrawCircles(false);//线条平滑lineDataSet.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER);lineDataSet.setDrawFilled(true);lineDataSet.setFillAlpha(50);lineDataSet.setFillColor(Color.RED);
//        dataSet.setFillColor(R.drawable.gradient_chart_bg2);int[] colors = { getResources().getColor(R.color.colorAccent),getResources().getColor(android.R.color.white) };
//        dataSet.setFillColor(getResources().getColor(R.drawable.gradient_chart_bg2));//设置曲线下方渐变的阴影lineDataSet.setDrawFilled(true);lineDataSet.setFillDrawable(getResources().getDrawable(R.drawable.line_gradient_bg_shape));lineDataSet.setLineWidth(1.75f); // 线宽lineDataSet.setCircleSize(5f);// 显示的圆形大小lineDataSet.setDrawCircles(true);// 是否有圆点
//		lineDataSet.setDrawCircleHole(true);// 设置数据点是空心还是实心,默认空心lineDataSet.setDrawValues(true);//设置是否显示点的坐标值// 设置平滑曲线模式
//          lineDataSet.setMode(LineDataSet.Mode.STEPPED);//梯形
//          lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);//曲线模式lineDataSet.setMode(LineDataSet.Mode.LINEAR);//折线
//          lineDataSet.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER);//曲线模式//设置折线图填充
//        lineDataSet.setDrawFilled(true);LineData data = new LineData(lineDataSet);//无数据时显示的文字lineChart.setNoDataText("暂无数据");//折线图不显示数值data.setDrawValues(false);//得到X轴XAxis xAxis = lineChart.getXAxis();//设置X轴的位置(默认在上方)xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//设置X轴坐标之间的最小间隔xAxis.setGranularity(1f);//设置X轴的刻度数量,第二个参数为true,将会画出明确数量(带有小数点),但是可能值导致不均匀,默认(6,false)//xAxis.setLabelCount(list.size() / 6, false);
xAxis.setLabelCount(list.size(), false);//设置X轴的值(最小值、最大值、然后会根据设置的刻度数量自动分配刻度显示)xAxis.setAxisMinimum(0f);xAxis.setAxisMaximum((float) list.size());//不显示网格线xAxis.setDrawGridLines(false);// 标签倾斜
//        xAxis.setLabelRotationAngle(45);//设置X轴值为字符串 可在这里自定义要显示的单位xAxis.setValueFormatter(new IAxisValueFormatter(){@Overridepublic String getFormattedValue(float value, AxisBase axis){int IValue = (int) value;CharSequence format = DateFormat.format("MM/dd",System.currentTimeMillis()-(long)(list.size()-IValue)*24*60*60*1000);return format.toString();}});Legend mLegend = lineChart.getLegend(); //设置标示,就是那个一组y的value的
//        mLegend.setForm(Legend.LegendForm.DEFAULT); //默认圆形样式
//        mLegend.setForm(Legend.LegendForm.SQUARE); //方形样式
//        mLegend.setForm(Legend.LegendForm.CIRCLE); //圆形样式mLegend.setForm(Legend.LegendForm.LINE); //横线的样式mLegend.setFormSize(6f); //字体
//        mLegend.setXEntrySpace(6f); //设置在水平轴上 legend-entries 的间隙mLegend.setYEntrySpace(6f); //设置在垂直轴上 legend-entries 的间隙mLegend.setFormToTextSpace(6f); //设置 legend-form 和 legend-label 之间的空间mLegend.setWordWrapEnabled(true); //设置 Legend 是否自动换行? 目前仅支持BelowChartLeft,BelowChartRightmLegend.setTextColor(Color.RED); //设置字体颜色mLegend.setPosition(Legend.LegendPosition.BELOW_CHART_LEFT); //设置显示下位置在左侧
//        mLegend.setPosition(Legend.LegendPosition.BELOW_CHART_RIGHT); //设置显示下位置在右侧
//        mLegend.setPosition(Legend.LegendPosition.BELOW_CHART_CENTER); //设置显示下位置在中间
//        mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART); //设置显示图平行的右侧
//        mLegend.setPosition(Legend.LegendPosition.LEFT_OF_CHART); //设置显示图平行的左侧
//        mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART_CENTER); //设置显示图平行的右侧据居中
//        mLegend.setPosition(Legend.LegendPosition.LEFT_OF_CHART_INSIDE); //
//        mLegend.setPosition(Legend.LegendPosition.PIECHART_CENTER); //PieChart独有,折线图会显示在中间
//        mLegend.setPosition(Legend.LegendPosition.LEFT_OF_CHART_CENTER); //设置显示图平行的左侧据居中mLegend.setTypeface(Typeface.DEFAULT); //设置图例标签的字体
//        mLegend.setForm(Legend.LegendForm.NONE);//不绘制图形
//        mLegend.setForm(Legend.LegendForm.EMPTY);;//不绘制图形保留空间
//        mLegend.setForm(Legend.LegendForm.LINE); // 线
//        mLegend.setFormSize(14f); // 图形大小
//        mLegend.setFormLineWidth(9f);  // 图形线宽//隐藏LengendmLegend.setEnabled(true);// set custom labels and colors
//        mLegend.setCustom(ColorTemplate.VORDIPLOM_COLORS,
//                new String[] { "Set1", "Set2", "Set3", "Set4", "Set5" });LimitLine limitLineL = new LimitLine(8f, "临界点");//临界点limitLineL.setLineColor(Color.RED);limitLineL.setLineWidth(1.5f);limitLineL.setTextSize(10f);limitLineL.setTextColor(Color.RED);limitLineL.setLabelPosition(LimitLine.LimitLabelPosition.RIGHT_TOP);//标签位置limitLineL.enableDashedLine(5f,8f,0);  //设置虚线lineChart.getAxisLeft().addLimitLine(limitLineL);//设置均值LimitLine ll2 = new LimitLine(5, "均值");ll2.setLabel("均值");ll2.setTextColor(Color.parseColor("#5dbcfe"));ll2.setLineWidth(1f);ll2.setEnabled(true);ll2.setLineColor(Color.parseColor("#5dbcfe"));ll2.enableDashedLine(5f, 10f, 0f);//三个参数,第一个线宽长度,第二个线段之间宽度,第三个一般为0,是个补偿ll2.setLabelPosition(LimitLine.LimitLabelPosition.RIGHT_BOTTOM);//标签位置ll2.setTextSize(10f);lineChart.getAxisLeft().addLimitLine(ll2);//得到Y轴YAxis yAxis = lineChart.getAxisLeft();YAxis rightYAxis = lineChart.getAxisRight();//设置Y轴是否显示rightYAxis.setEnabled(false); //右侧Y轴不显示//设置y轴坐标之间的最小间隔//不显示网格线yAxis.setDrawGridLines(false);//设置Y轴坐标之间的最小间隔yAxis.setGranularity(1);//设置y轴的刻度数量//+2:最大值n就有n+1个刻度,在加上y轴多一个单位长度,为了好看,so+2yAxis.setLabelCount(Collections.max(list) + 2, false);//设置从Y轴值yAxis.setAxisMinimum(0f);//+1:y轴多一个单位长度,为了好看yAxis.setAxisMaximum(Collections.max(list) + 1);//y轴,可在这里设置自定义的单位yAxis.setValueFormatter(new IAxisValueFormatter(){@Overridepublic String getFormattedValue(float value, AxisBase axis){int IValue = (int) value;return String.valueOf(IValue)+"辆";}});//图例:得到Lengend
//        Legend legend = lineChart.getLegend();//隐藏Lengend
//        legend.setEnabled(true);//隐藏描述Description description = new Description();description.setEnabled(true);lineChart.setDescription(description);lineChart.getDescription().setText("hi");//折线图点的标记MyMarkersView mv = new MyMarkersView(this);lineChart.setMarker(mv);//设置数据lineChart.setData(data);//设置动画效果lineChart.animateY(2000, Easing.EasingOption.Linear);lineChart.animateX(2000, Easing.EasingOption.Linear);//图标刷新lineChart.invalidate();}
}

2.渐变色背景:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="rectangle"><gradientandroid:angle="-90"android:endColor="#FEFFFF"android:startColor="#D9F3FF"></gradient>
</shape>

3.主函数布局:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#ccc"android:orientation="vertical"tools:context=".MainActivity"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><com.github.mikephil.charting.charts.LineChartandroid:id="@+id/lineChart"android:layout_width="match_parent"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_marginBottom="10dp"android:layout_height="220dp"android:layout_centerInParent="true"/></LinearLayout>
</ScrollView>

4.设置自定义标记提示框

import android.content.Context;
import android.text.format.DateFormat;
import android.widget.TextView;import com.example.m1571.mympandroidchart.R;
import com.github.mikephil.charting.components.MarkerView;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.utils.MPPointF;import java.text.DecimalFormat;public class MyMarkersView extends MarkerView{private TextView tvContent;private DecimalFormat format = new DecimalFormat("##0");public MyMarkersView(Context context) {super(context, R.layout.layout_markerview);//这个布局自己定义tvContent = (TextView) findViewById(R.id.tvContent);}//显示的内容@Overridepublic void refreshContent(Entry e, Highlight highlight) {tvContent.setText(format(e.getX())+"\n"+format.format(e.getY())+"辆");super.refreshContent(e, highlight);}//标记相对于折线图的偏移量@Overridepublic MPPointF getOffset() {return new MPPointF(-(getWidth() / 2), -getHeight());}//时间格式化(显示今日往前30天的每一天日期)public String  format(float x){int IValue = (int) x;CharSequence format = DateFormat.format("MM/dd",System.currentTimeMillis()-(long)(list.size()-IValue)*24*60*60*1000);// CharSequence format = DateFormat.format("MM月dd日",// System.currentTimeMillis()-(long) (30-(int)x)*24*60*60*1000);return format.toString();}}

5.提示框布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"android:layout_height="match_parent"><LinearLayoutandroid:background="@drawable/bg_shape_c"android:layout_width="match_parent"android:paddingLeft="10dp"android:paddingRight="10dp"android:paddingTop="6dp"android:paddingBottom="6dp"android:layout_height="wrap_content"><TextViewandroid:id="@+id/tvContent"android:text="KING"android:layout_width="wrap_content"android:layout_height="wrap_content" /></LinearLayout></LinearLayout>

6.设置可以左右滑动的折线图效果:

 
//xAxis.setLabelCount(list.size() / 6, false);//注意请注释掉这一句代码
lineChart.setVisibleXRange(0, 6);   //x轴可显示的坐标范围lineChart.setDrawGridBackground(false); //表格颜色lineChart.setGridBackgroundColor(Color.GRAY & 0x70FFFFFF); //表格的颜色,设置一个透明度lineChart.setTouchEnabled(true); //可点击lineChart.setDragEnabled(true);  //可拖拽lineChart.setScaleEnabled(false);  //可缩放lineChart.setPinchZoom(false);
//        lineChart.setBackgroundColor(Color.WHITE); //设置背景颜色

7.设置折线中圆点对应的颜色(设置多种颜色值)

//根据数值大小区间来设置圆点对应的颜色//在方法中判断数值的大小和对应设置的颜色private static List<Integer> getLineColors(List<Entry> yValues,int normalColor, int exceColor, int exceQcColor) {List<Integer> list = new ArrayList<>();
//		float maxSD = (float) (targetValue + sdValue * sdMultiple);
//		float minSD = (float) (targetValue - sdValue * sdMultiple);float maxSD = 3;float minSD = 0;for (int i = 0; i < yValues.size(); i++) {Entry entry = yValues.get(i);
//            if (errIndexs.contains(i)) {  //限值异常质控不用和sd比较确定显示什么颜色
//                list.add(exceQcColor);
//                continue;
//            }
//			if (entry.getVal() >= maxSD || entry.getVal() < minSD) {//此处的entry.getVal()(2.1.6版本)等于entry.getY()(3.0.1版本)if (entry.getY() >= 6) {list.add(exceColor);} else if(entry.getY() == 5){list.add(normalColor);} else if(entry.getY() < 5){
//                list.add(exceQcColor);}}return list;}
 //设置折线圆点多种颜色值List<Integer> lineColors = getLineColors(entries, Color.RED, Color.YELLOW,Color.BLUE);lineDataSet.setCircleColors(lineColors);// 圆形的颜色

8.设置显示折线图圆点的数值,可以自定义单位:

//设置圆点显示内容替换原来的%为元lineDataSet.setValueFormatter(new TestDefaultValueFormatter());
 //1.在PieChartUtil 中创建内部类private class TestDefaultValueFormatter implements IValueFormatter {private DecimalFormat mFormat;public TestDefaultValueFormatter(){mFormat = new DecimalFormat("###");//十进制格式}@Overridepublic String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) {return mFormat.format(value)+"辆";}}
lineDataSet.setDrawValues(true);//设置是否显示点的坐标值

 

其它案例:

https://github.com/897532167/ChartManager

https://github.com/JinBoy23520/MPAndroidChartDemoByJin

 

 

 

这篇关于Android 图表开源框架之MPAndroidChart LineChart折线图(三)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/432212

相关文章

Android Mainline基础简介

《AndroidMainline基础简介》AndroidMainline是通过模块化更新Android核心组件的框架,可能提高安全性,本文给大家介绍AndroidMainline基础简介,感兴趣的朋... 目录关键要点什么是 android Mainline?Android Mainline 的工作原理关键

如何解决idea的Module:‘:app‘platform‘android-32‘not found.问题

《如何解决idea的Module:‘:app‘platform‘android-32‘notfound.问题》:本文主要介绍如何解决idea的Module:‘:app‘platform‘andr... 目录idea的Module:‘:app‘pwww.chinasem.cnlatform‘android-32

Android实现打开本地pdf文件的两种方式

《Android实现打开本地pdf文件的两种方式》在现代应用中,PDF格式因其跨平台、稳定性好、展示内容一致等特点,在Android平台上,如何高效地打开本地PDF文件,不仅关系到用户体验,也直接影响... 目录一、项目概述二、相关知识2.1 PDF文件基本概述2.2 android 文件访问与存储权限2.

Android Studio 配置国内镜像源的实现步骤

《AndroidStudio配置国内镜像源的实现步骤》本文主要介绍了AndroidStudio配置国内镜像源的实现步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,... 目录一、修改 hosts,解决 SDK 下载失败的问题二、修改 gradle 地址,解决 gradle

在Android平台上实现消息推送功能

《在Android平台上实现消息推送功能》随着移动互联网应用的飞速发展,消息推送已成为移动应用中不可或缺的功能,在Android平台上,实现消息推送涉及到服务端的消息发送、客户端的消息接收、通知渠道(... 目录一、项目概述二、相关知识介绍2.1 消息推送的基本原理2.2 Firebase Cloud Me

Android中Dialog的使用详解

《Android中Dialog的使用详解》Dialog(对话框)是Android中常用的UI组件,用于临时显示重要信息或获取用户输入,本文给大家介绍Android中Dialog的使用,感兴趣的朋友一起... 目录android中Dialog的使用详解1. 基本Dialog类型1.1 AlertDialog(

Python Dash框架在数据可视化仪表板中的应用与实践记录

《PythonDash框架在数据可视化仪表板中的应用与实践记录》Python的PlotlyDash库提供了一种简便且强大的方式来构建和展示互动式数据仪表板,本篇文章将深入探讨如何使用Dash设计一... 目录python Dash框架在数据可视化仪表板中的应用与实践1. 什么是Plotly Dash?1.1

基于Flask框架添加多个AI模型的API并进行交互

《基于Flask框架添加多个AI模型的API并进行交互》:本文主要介绍如何基于Flask框架开发AI模型API管理系统,允许用户添加、删除不同AI模型的API密钥,感兴趣的可以了解下... 目录1. 概述2. 后端代码说明2.1 依赖库导入2.2 应用初始化2.3 API 存储字典2.4 路由函数2.5 应

Python GUI框架中的PyQt详解

《PythonGUI框架中的PyQt详解》PyQt是Python语言中最强大且广泛应用的GUI框架之一,基于Qt库的Python绑定实现,本文将深入解析PyQt的核心模块,并通过代码示例展示其应用场... 目录一、PyQt核心模块概览二、核心模块详解与示例1. QtCore - 核心基础模块2. QtWid

Android Kotlin 高阶函数详解及其在协程中的应用小结

《AndroidKotlin高阶函数详解及其在协程中的应用小结》高阶函数是Kotlin中的一个重要特性,它能够将函数作为一等公民(First-ClassCitizen),使得代码更加简洁、灵活和可... 目录1. 引言2. 什么是高阶函数?3. 高阶函数的基础用法3.1 传递函数作为参数3.2 Lambda