本文主要是介绍Android 图表开源框架之MPAndroidChart LineChart折线图(四)动态添加数据,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
Android 图表开源框架之MPAndroidChart LineChart折线图(一)
Android 图表开源框架之MPAndroidChart LineChart折线图(二)
Android 图表开源框架之MPAndroidChart LineChart折线图(三)
Android 图表开源框架之MPAndroidChart LineChart之常用自定义设置功能
一.快速实现:(当前mpandroidchartlibrary版本是2.1.6版本)
1.主函数代码:动态模拟添加数据、清除数据、折线展示动画效果、刷新数据等
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Color;
import android.graphics.Matrix;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;import com.github.mikephil.charting.animation.Easing;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.AxisBase;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.LimitLine;
import com.github.mikephil.charting.components.MarkerView;
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.formatter.DefaultXAxisValueFormatter;
import com.github.mikephil.charting.formatter.XAxisValueFormatter;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.utils.ColorTemplate;
import com.github.mikephil.charting.utils.ViewPortHandler;import java.util.ArrayList;
import java.util.List;import me.samlss.utils.LineChartManager2;/**** 可参考网址 https://github.com/msandroid/androidChartDemo* **/
public class MpAndroidChart5Activity extends AppCompatActivity {private LineChart mChart;private List<Float> mList = new ArrayList<>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_mp_chart5);mChart = (LineChart) findViewById(R.id.chart);mList.clear();
// mChart.setDescription("2020-08-05 杭州 晴 伴有黑格比台风 气温26~36℃ 不宜外出");
// mChart.setNoDataTextDescription("暂无数据");mChart.setTouchEnabled(true);// 可拖曳mChart.setDragEnabled(true);// 可缩放mChart.setScaleEnabled(true);mChart.setDrawGridBackground(false);mChart.setPinchZoom(true);// 设置图表的背景颜色mChart.setBackgroundColor(Color.LTGRAY);LineData data = new LineData();// 数据显示的颜色data.setValueTextColor(Color.WHITE);// 先增加一个空的数据,随后往里面动态添加mChart.setData(data);// 图表的注解(只有当数据集存在时候才生效)Legend l = mChart.getLegend();// 可以修改图表注解部分的位置// l.setPosition(LegendPosition.LEFT_OF_CHART);// 线性,也可是圆l.setForm(Legend.LegendForm.LINE);// 颜色l.setTextColor(Color.WHITE);// x坐标轴XAxis xl = mChart.getXAxis();xl.setTextColor(Color.WHITE);xl.setDrawGridLines(false);//设置X轴上每个竖线是否显示xl.setDrawLabels(true); //设置是否绘制X轴上的对应值(标签)xl.setAvoidFirstLastClipping(true);//设置x轴间距xl.setGridLineWidth(2f);// 横坐标文字
// xl.setValueFormatter(new IAxisValueFormatter {
// @Override
// public String getXValue(String s, int i, ViewPortHandler viewPortHandler) {
// return null;
// }
//
// @Override
// public String getFormattedValue(float value, AxisBase axis) {
// if (value < dataX.size()){
// return dataX.get((int) value);
// }else {
// return null;
// }
// }
// });// 几个x坐标轴之间才绘制?xl.setSpaceBetweenLabels(5);// 如果false,那么x坐标轴将不可见xl.setEnabled(true);// 将X坐标轴放置在底部,默认是在顶部。xl.setPosition(XAxis.XAxisPosition.BOTTOM);// 图表左边的y坐标轴线YAxis leftAxis = mChart.getAxisLeft();leftAxis.setTextColor(Color.WHITE);// 最大值leftAxis.setAxisMaxValue(90f);// 最小值leftAxis.setAxisMinValue(40f);// 不一定要从0开始leftAxis.setStartAtZero(false);leftAxis.setDrawGridLines(true);YAxis rightAxis = mChart.getAxisRight();// 不显示图表的右边y坐标轴线rightAxis.setEnabled(false);//默认添加一组数据
// for (int i = 0; i < 9; i++) {
// addEntry();
// }// 每点击一次按钮,增加一个点Button addButton = (Button) findViewById(R.id.button);Button allButton = (Button) findViewById(R.id.bt_all);Button clearButton = (Button) findViewById(R.id.bt_clear);Button refreshButton = (Button) findViewById(R.id.bt_refresh);addButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {mList.size();addEntry();}});allButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {for (int i = 0; i < 9; i++) {addEntry();}}});clearButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {
// mChart.removeAllViews();
// mChart.removeAllViewsInLayout();
// mChart.clearAllJobs();
// mChart.clear();mChart.notifyDataSetChanged();mChart.setNoDataText("Sorry, No data");// 无数据mChart.invalidate();}});refreshButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {mChart.getViewPortHandler().refresh(new Matrix(), mChart, true);mChart.notifyDataSetChanged();mChart.invalidate();}});//--------// 弹出的数据点提示框。MarkerView mv = new MyMarkerView(this, R.layout.marker_view);mChart.setMarkerView(mv);}/*** @author Phil** 构造一个类似Android Toast的弹出消息提示框。*/private class MyMarkerView extends MarkerView {private TextView tvContent;public MyMarkerView(Context context, int layoutResource) {super(context, layoutResource);tvContent = (TextView) findViewById(R.id.tvContent);}@Overridepublic void refreshContent(Entry e, Highlight highlight) {int n = (int) e.getVal();tvContent.setText(e.getVal() + "");// if (e instanceof CandleEntry) {// CandleEntry ce = (CandleEntry) e;// tvContent.setText(""// + Utils.formatNumber(ce.getHigh(), 0, true));// } else {// tvContent.setText("" + Utils.formatNumber(e.getVal(), 0, true));// }}@Overridepublic int getXOffset(float v) {return -(getWidth() / 2);}@Overridepublic int getYOffset(float v) {return -getHeight();}// @Override
// public int getXOffset() {
// return -(getWidth() / 2);
// }
//
// @Override
// public int getYOffset() {
// return -getHeight();
// }}// 添加进去一个坐标点private void addEntry() {LineData data = mChart.getData();// 每一个LineDataSet代表一条线,每张统计图表可以同时存在若干个统计折线,这些折线像数组一样从0开始下标。// 本例只有一个,那么就是第0条折线LineDataSet set = data.getDataSetByIndex(0);// 如果该统计折线图还没有数据集,则创建一条出来,如果有则跳过此处代码。if (set == null) {set = createLineDataSet();data.addDataSet(set);}// 先添加一个x坐标轴的值// 因为是从0开始,data.getXValCount()每次返回的总是全部x坐标轴上总数量,所以不必多此一举的加1data.addXValue((data.getXValCount()) + "");// 生成随机测试数float f = (float) ((Math.random()) * 20 + 50);mList.add(f);// set.getEntryCount()获得的是所有统计图表上的数据点总量,// 如从0开始一样的数组下标,那么不必多次一举的加1Entry entry = new Entry(f, set.getEntryCount());// 往linedata里面添加点。注意:addentry的第二个参数即代表折线的下标索引。// 因为本例只有一个统计折线,那么就是第一个,其下标为0.// 如果同一张统计图表中存在若干条统计折线,那么必须分清是针对哪一条(依据下标索引)统计折线添加。data.addEntry(entry, 0);// 像ListView那样的通知数据更新mChart.notifyDataSetChanged();// 当前统计图表中最多在x轴坐标线上显示的总量mChart.setVisibleXRangeMaximum(5);// y坐标轴线最大值// mChart.setVisibleYRange(30, AxisDependency.LEFT);// 将坐标移动到最新// 此代码将刷新图表的绘图mChart.moveViewToX(data.getXValCount() - 5);// mChart.moveViewTo(data.getXValCount()-7, 55f,// AxisDependency.LEFT);//设置动画效果1
// mChart.animateY(2000, Easing.EasingOption.Linear);
// mChart.animateX(2000, Easing.EasingOption.Linear);//设置动画效果2mChart.animateX(1000); // 立即执行的动画,x轴//动画效果:大同小异,不作介绍
// mChart.animateX(2500, Easing.EasingOption.EaseOutBounce); //贪吃蛇步伐,最后一个闪烁一次
// mChart.animateX(2500, Easing.EasingOption.Linear); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInQuad); //贪吃蛇步伐,第一个延时执行
// mChart.animateX(2500, Easing.EasingOption.EaseOutQuad); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInOutQuad); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInCubic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseOutCubic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInOutCubic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInQuart); //贪吃蛇步伐,其它都是差不多的动画
// mChart.animateX(2500, Easing.EasingOption.EaseOutQuart); //贪吃蛇步伐,快速展示
// mChart.animateX(2500, Easing.EasingOption.EaseInOutQuart); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInSine); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseOutSine); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInOutSine); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInExpo); //贪吃蛇步伐,先慢后快
// mChart.animateX(2500, Easing.EasingOption.EaseOutExpo); //贪吃蛇步伐,全部延时渐变显示
// mChart.animateX(2500, Easing.EasingOption.EaseInOutExpo); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInCirc); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseOutCirc); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInOutCirc); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInElastic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseOutElastic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInOutElastic); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseInBack); //贪吃蛇步伐
// mChart.animateX(2500, Easing.EasingOption.EaseOutBack); //贪吃蛇步伐,展示完返回上一界面
// mChart.animateX(2500, Easing.EasingOption.EaseInOutBack); //贪吃蛇步伐,展示完返回上一界面
// mChart.animateX(2500, Easing.EasingOption.EaseInBounce); //贪吃蛇步伐,第一个闪烁,然后展示
// mChart.animateX(2500, Easing.EasingOption.EaseOutBounce); //贪吃蛇步伐,快速展示,最后一个闪烁
// mChart.animateX(2500, Easing.EasingOption.EaseInOutBounce); //贪吃蛇步伐mChart.invalidate();}// 初始化数据集,添加一条统计折线,可以简单的理解是初始化y坐标轴线上点的表征private LineDataSet createLineDataSet() {LineDataSet set = new LineDataSet(null, "动态添加的数据");set.setAxisDependency(YAxis.AxisDependency.LEFT);// 折线的颜色set.setColor(ColorTemplate.getHoloBlue());set.setCircleColor(Color.WHITE);set.setLineWidth(2f);//折线宽度set.setCircleSize(10f);//圆点大小set.setCircleColor(Color.YELLOW);//设置圆点的颜色set.setFillAlpha(128);set.setFillColor(ColorTemplate.getHoloBlue());set.setHighLightColor(Color.GREEN);//设置高亮颜色set.setHighLightColor(Color.RED);//设置高亮颜色set.setValueTextColor(Color.WHITE);set.setValueTextSize(10f);set.setDrawValues(true);return set;}
}
2.布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"tools:context=".MainActivity"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"><Buttonandroid:id="@+id/button"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:text="动态添加数据" /><Buttonandroid:id="@+id/bt_all"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:text="动态添加一组数据" /><Buttonandroid:id="@+id/bt_clear"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:text="清除数据" /><Buttonandroid:id="@+id/bt_refresh"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:text="刷新数据" /></LinearLayout><com.github.mikephil.charting.charts.LineChartandroid:id="@+id/chart"android:layout_width="match_parent"android:layout_height="match_parent" /></LinearLayout>
这篇关于Android 图表开源框架之MPAndroidChart LineChart折线图(四)动态添加数据的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!