Android 图表开源框架之MPAndroidChart LineChart折线图（五）

Android 图表开源框架之MPAndroidChart LineChart折线图（一）

Android 图表开源框架之MPAndroidChart LineChart折线图（二）

Android 图表开源框架之MPAndroidChart LineChart折线图（三）

Android 图表开源框架之MPAndroidChart LineChart折线图（四）动态添加数据

Android 图表开源框架之MPAndroidChart PieChart扇形图（一）

Android 图表开源框架之MPAndroidChart PieChart扇形图（二）

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

Android 图表开源框架之MPAndroidChart LineChart折线图（五）_第1张图片

一.快速实现：

1.添加依赖：

app build.gradle文件：

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

packagingOptions {        exclude 'META-INF/proguard/androidx-annotations.pro'    }

最外层build.gradle文件：

// Top-level build file where you can add configuration options common to all sub-projects/modules.buildscript {        repositories {        google()        jcenter()    }    dependencies {        classpath 'com.android.tools.build:gradle:3.1.3'                // NOTE: Do not place your application dependencies here; they belong        // in the individual module build.gradle files    }}allprojects {    repositories {        google()        jcenter()        maven { url "https://jitpack.io" }    }}task clean(type: Delete) {    delete rootProject.buildDir}

2.主函数逻辑：

private LineChart lineChart;    float datas[] = {14f,15f,16f,17f,16f,16f};    float datas2[] = {17f,16f,15f,14f,17f,14f};    final String weeks[] = {"昨天","今天","明天","周五","周六","周日"};    //在MPAndroidChart一般都是通过List对象来装数据的    final List entries = new ArrayList();  lineChart = (LineChart) findViewById(R.id.lineChart); setThreeMpChart(); /**     * 3.1.0版本使用     */    public void setThreeMpChart(){        //循环取出数据        for(int i = 0; i < datas.length; i++){            entries.add(new Entry(i,datas[i]));        }        Description description = new Description();//描述信息        description.setEnabled(false);//是否可用        lineChart.setDescription(description);//不然会显示默认的 Description。        lineChart.setTouchEnabled(true); // 设置是否可以触摸        lineChart.setDragEnabled(true);// 是否可以拖拽        lineChart.setScaleEnabled(true);// 是否可以缩放        lineChart.setPinchZoom(true);//y轴的值是否跟随图表变换缩放;如果禁止，y轴的值会跟随图表变换缩放        lineChart.setDoubleTapToZoomEnabled(false);//是否允许双击进行缩放        lineChart.setScaleXEnabled(true);//是否允许以X轴缩放        lineChart.setDrawGridBackground(false);// 是否显示表格颜色        lineChart.setGridBackgroundColor(Color.TRANSPARENT);// 表格的的颜色        lineChart.animateY(1000, Easing.Linear);//设置动画        lineChart.setExtraBottomOffset(5f);//防止底部数据显示不完整，设置底部偏移量        lineChart.setExtraRightOffset(45f);//防止右侧数据显示不完整，设置底部偏移量//x轴配置        XAxis xAxis = lineChart.getXAxis();        xAxis.setEnabled(true);//是否可用        xAxis.setDrawLabels(true);//是否显示数值        xAxis.setDrawAxisLine(true);//是否显示坐标线        xAxis.setAxisLineColor(Color.BLACK);//设置坐标轴线的颜色        xAxis.setAxisLineWidth(0.8f);//设置坐标轴线的宽度        xAxis.setDrawGridLines(false);//是否显示竖直风格线        xAxis.setTextColor(Color.BLACK);//X轴文字颜色//        xAxis.setTextSize(12f);//X轴文字大小        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//X轴文字显示位置        xAxis.setSpaceMin(1f);//左空白区大小        xAxis.setSpaceMax(1f);//右空白区大小        xAxis.setGranularity(1);//间隔1        //设置X轴坐标自定义数据格式        xAxis.setValueFormatter(new IndexAxisValueFormatter(){            @Override            public String getFormattedValue(float value) {                //设置当前时间                int IValue = (int) value;                int a =(entries.size() - IValue);//                CharSequence format = DateFormat.format("MM/dd",//                        System.currentTimeMillis() - (long) (entries.size() - IValue) * 24 * 60 * 60 * 1000);//                return format.toString();//                return super.getFormattedValue(value);                //自定义样式 IAxisValueFormatter  星期                //防止数组越界判断范围                if (IValue < 0 || IValue >= weeks.length) {                    return "";                } else {                    return weeks[IValue];                }            }        });        xAxis.setGranularity(1);//间隔1//左y轴配置        YAxis lyAxis = lineChart.getAxisLeft();        lyAxis.setEnabled(true);//是否可用        lyAxis.setDrawLabels(true);//是否显示数值        lyAxis.setDrawAxisLine(true);//是否显示坐标线        lyAxis.setDrawGridLines(false);//是否显示水平网格线        lyAxis.setDrawZeroLine(true);是否绘制零线        lyAxis.setZeroLineColor(Color.BLACK);//        lyAxis.setZeroLineWidth(0.8f);//        lyAxis.enableGridDashedLine(10f, 10f, 0f);//网格虚线        lyAxis.setGridColor(Color.BLACK);//网格线颜色        lyAxis.setGridLineWidth(0.8f);//网格线宽度        lyAxis.setAxisLineColor(Color.BLACK);//坐标线颜色        lyAxis.setTextColor(Color.BLACK);//左侧文字颜色        lyAxis.setTextSize(12f);//左侧文字大小//右y轴配置        YAxis ryAxis = lineChart.getAxisRight();        ryAxis.setEnabled(true);//是否可用        // 不显示y轴右边的值        ryAxis.setEnabled(false);        ryAxis.setDrawAxisLine(true);        ryAxis.setDrawZeroLine(true);//        ryAxis.setZeroLineWidth(1f);        ryAxis.setAxisLineWidth(0.8f);//设置右侧边界线宽度        ryAxis.setAxisLineColor(Color.BLACK);        //X轴左侧数据设置//        YAxis axisLeft = lineChart.getAxisLeft();//        axisLeft.setEnabled(true);//是否可用//        // 不显示y轴左边的值//        axisLeft.setEnabled(true);//        axisLeft.setDrawAxisLine(true);//        axisLeft.setDrawZeroLine(true);        ryAxis.setZeroLineWidth(1f);//        axisLeft.setAxisLineWidth(1);//设置左侧边界线宽度//        axisLeft.setAxisLineColor(Color.BLACK);//标签配置        Legend legend = lineChart.getLegend();        legend.setEnabled(true);//是否可用        //x轴和y轴的数据        //循环取出数据//        for(int i = 0; i < datas2.length; i++){//            entries.add(new Entry(i,datas2[i]));//        }//        YourData[] dataObjects = ...;//        List entries = new ArrayList();//        for (YourData data : dataObjects) {//            entries.add(new Entry(data.getValueX(), data.getValueY()));//        }        LimitLine limitLineL = new LimitLine(15f, "临界点");//临界点        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 limitLine2 = new LimitLine(14.5f, "SD");//临界点        limitLine2.setLineColor(Color.RED);        limitLine2.setLineWidth(1.5f);        limitLine2.setTextSize(10f);        limitLine2.setTextColor(Color.RED);        limitLine2.setLabelPosition(LimitLine.LimitLabelPosition.RIGHT_TOP);//标签位置        limitLine2.enableDashedLine(5f,8f,0);  //设置虚线        lineChart.getAxisLeft().addLimitLine(limitLine2);        //折线图点的标记        MyMarkerView mv = new MyMarkerView(this);        lineChart.setMarker(mv);        LineDataSet dataSet = new LineDataSet(entries, "Label"); // 添加数据        // 自定义各种数据样式（不设置则使用默认值）//        dataSet.setColor(...);//        dataSet.setValueTextColor(...);        LineData lineData = new LineData(dataSet);        //多个折线时使用//        LineDataSet lineDataSet = new LineDataSet(entries,"ONE");//        LineDataSet lineDataSet2 = new LineDataSet(entries,"TWO");//        //保存LineDataSet集合//        ArrayList dataSets = new ArrayList<>();//        dataSets.add(lineDataSet); // add the datasets//        dataSets.add(lineDataSet2); // add the datasets//        LineData lineDataLists = new LineData(dataSets);//添加多个折线集合//        dataSet.setColor(Color.RED);//设置折线的颜色        dataSet.setCircleSize(5f);// 显示的圆形大小        dataSet.setCircleColor(Color.RED);//设置圆点的颜色        //设置曲线值的圆点是实心还是空心        dataSet.setDrawCircleHole(true);        dataSet.setDrawFilled(true);//设置不画数据覆盖的阴影层//        dataSet.setDrawValues(false);//不绘制线的数据//        dataSet.setLineWidth(2f);//设置折线宽度//        dataSet.setCircleRadius(6f);        // 填充曲线下方的区域，红色，半透明。        dataSet.setDrawFilled(true);        dataSet.setFillAlpha(65);//        dataSet.setFillColor(Color.WHITE);//        dataSet.setDrawCircleHole(false);        dataSet.setDrawCircles(true);//是否显示圆心        dataSet.setValueTextColor(Color.rgb(89, 194, 230)); //数值显示的颜色        dataSet.setValueTextSize(8f);     //数值显示的大小        // 设置平滑曲线//        dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);        lineChart.setData(lineData);//        lineChart.animateX(2000);        lineChart.invalidate(); // 刷新//        Matrix m = new Matrix();//        m.postScale(1, 1f);//两个参数分别是x,y轴的缩放比例。例如：将x轴的数据放大为之前的1.5倍，《这个地方是在设置能滑动的时候编辑的，假如X轴最多展示5条但是呢有10条数据，那么这里就是2,1》        lineChart.getViewPortHandler().refresh(new Matrix(),lineChart,true);//将图表动画显示之前进行缩放    }    /**//     * 更新图表//     *//     * @param chart   图表//     * @param values  数据//     * @param valueType 数据类型//     *///    public static void notifyDataSetChanged(LineChart chart, List values,//                                            final int valueType) {//        chart.getXAxis().setValueFormatter(new IAxisValueFormatter() {//            @Override//            public String getFormattedValue(float value, AxisBase axis) {//                return weeks(valueType)[(int) value];//            }//        });////        chart.invalidate();        setChartData(chart, values);//    }

3.自定义MarkerView显示视图：

import android.content.Context;import android.text.format.DateFormat;import android.widget.TextView;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 MyMarkerView extends MarkerView{    private TextView tvContent;    private DecimalFormat format = new DecimalFormat("##0");    public MyMarkerView(Context context) {        super(context, R.layout.layout_markerview);//这个布局自己定义        tvContent = (TextView) findViewById(R.id.tvContent);    }    //显示的内容    @Override    public void refreshContent(Entry e, Highlight highlight) {//        tvContent.setText(format(e.getX())+"\n"+format.format(e.getY())+"辆");        tvContent.setText(format.format(e.getY())+"辆");        super.refreshContent(e, highlight);    }    //标记相对于折线图的偏移量    @Override    public MPPointF getOffset() {        return new MPPointF(-(getWidth() / 2), -getHeight());    }    //时间格式化（显示今日往前30天的每一天日期）    public String  format(float x)    {        CharSequence format = DateFormat.format("MM月dd日",                System.currentTimeMillis()-(long) (30-(int)x)*24*60*60*1000);        return format.toString();    }}

4.MarkerView布局：

<?xml version="1.0" encoding="utf-8"?>

5.背景色：

<?xml version="1.0" encoding="utf-8"?>

 #3F51B5    #303F9F    #FF4081    #89000000    #fff    #333    #ffd2d2d2    #33691E    #9C27B0    #FF4081    #FF9800    #00BCD4    #F57F17    #454545    #707070    #00ff00    #FF222222    #FFEEEEEE

https://github.com/PhilJay/MPAndroidChart

更多相关文章

随机推荐