时间轴的曲线图

1: 自定义lingchart,使其X轴为时间轴,原理为 2018-10-16 10:29:33, 已时间为单位,截取时 和 分钟   

       X轴值=时*60+分钟

package com.zmm.customcurveview;

import android.content.Context;
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.support.v4.content.ContextCompat;
import android.util.AttributeSet;
import android.view.View;
import android.widget.RelativeLayout;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Description;
import com.github.mikephil.charting.components.Legend;
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.interfaces.datasets.ILineDataSet;

import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import static com.github.mikephil.charting.components.Legend.LegendPosition.ABOVE_CHART_LEFT;

/**
 * Description:
 * Author:zhangmengmeng
 * Date:2018/2/1
 * Time:下午3:44
 */

public class TimeCurveView extends RelativeLayout {


    private LineChart mChart;


    public TimeCurveView(Context context) {
        this(context,null);
    }

    public TimeCurveView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }

    public TimeCurveView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();

    }

    private void initView() {

        View view = View.inflate(getContext(), R.layout.item_curve_view, this);
        mChart = view.findViewById(R.id.line_chart);
    }

    public void initChartData(Map<Float, Float> map) {

        //初始化图表
        Description description = new Description();
        description.setText("时间");//设置描述文字内容
        description.setTextColor(this.getResources().getColor(R.color.black));//设置描述文字的颜色
        description.setTextSize(10f);
        description.setXOffset(-15f);
        description.setYOffset(3f);//描述文字的偏移

        mChart.setDescription(description);//设置图表的描述文字,会显示在图表的右下角
        mChart.setTouchEnabled(true);//设置是否可触摸
        mChart.setNoDataText("当前数据为空");//设置当 chart 为空时显示的描述文字
        mChart.setExtraBottomOffset(10f);

//        mChart.getDescription().setEnabled(false);//隐藏右下角描述

        //setChartData下面的"圈数" 的设置
        Legend legend = mChart.getLegend();
        legend.setEnabled(true);//设置Legend启用或禁用。 如果禁用, Legend 将不会被绘制。
        legend.setFormSize(25f);
        legend.setForm(Legend.LegendForm.NONE);//样式,无
        legend.setPosition(ABOVE_CHART_LEFT);
        legend.setXOffset(-20f);


        //X轴 建议隐藏,然后自定义一组展示出的数据,如:分钟0 5 10 15 20 30等
        XAxis xAxis = mChart.getXAxis();
        xAxis.setEnabled(true);//设置轴启用或禁用
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setTextSize(10);
        xAxis.setTextColor(this.getResources().getColor(R.color.chart_text));
        xAxis.setAxisMinimum(0);
        xAxis.setAxisMaximum(1440);


        xAxis.setValueFormatter(new MyXFormatter());

        xAxis.setAxisLineWidth(1f);
        xAxis.setDrawGridLines(false);//是否展示网格线

        //Y轴   getAxisLeft
        YAxis yAxis = mChart.getAxisLeft();
        yAxis.setEnabled(true);
        yAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
        yAxis.setTextSize(10);
        yAxis.setTextColor(this.getResources().getColor(R.color.chart_text));
        yAxis.setAxisMinimum(0);
//        yAxis.setAxisMaximum(100);
        yAxis.setLabelCount(4, false);
        yAxis.setAxisLineWidth(1f);
        yAxis.setDrawGridLines(true);//是否展示网格线
        yAxis.setValueFormatter(new MyYFormatter(100));


        //右侧,一般不用,设为false即可
        YAxis rightAxis = mChart.getAxisRight();
        rightAxis.setTextSize(20f);
        rightAxis.setEnabled(false);

        ArrayList<Entry> entries = new ArrayList<>();

//        for (Map.Entry<Float, Float> entry : map.entrySet()) {
//            System.out.println("--------Key = " + entry.getKey() + ", Value = " + entry.getValue());
//            entries.add(new Entry(entry.getKey(),entry.getValue()));
//        }

        for (float x = 0; x < 1440; x++) {


            float y = getRandom(30, 20);

            entries.add(new Entry(x,y));
            entries.add(new Entry(x,y));
            x+=20;
        }


        setChartData(entries);

        //去除折线图上的小圆圈
        List<ILineDataSet> sets = mChart.getData().getDataSets();

        for (ILineDataSet iSet : sets) {

            LineDataSet set = (LineDataSet) iSet;
            set.setDrawValues(false);
            set.setDrawCircles(false);
//            set.setMode(LineDataSet.Mode.CUBIC_BEZIER);
            set.setMode(LineDataSet.Mode.LINEAR);
        }

    }

    private void setChartData(ArrayList<Entry> yVals1) {

        mChart.invalidate();
        mChart.notifyDataSetChanged();
        LineDataSet set1;

        if (mChart.getData() != null && mChart.getData().getDataSetCount() > 0) {

            set1 = (LineDataSet) mChart.getData().getDataSetByIndex(0);

            set1.setValues(yVals1);

            mChart.getData().notifyDataChanged();
            mChart.notifyDataSetChanged();
        } else {
            set1 = new LineDataSet(yVals1, "警报值");
            set1.setColor(this.getResources().getColor(R.color.colorLine));
            set1.setLineWidth(1f);
            //是否绘制阴影
            set1.setDrawFilled(true);
            Drawable drawable = ContextCompat.getDrawable(getContext(), R.drawable.fade_left);
            set1.setFillDrawable(drawable);

            LineData data = new LineData(set1);
            data.setValueTextColor(Color.WHITE);
            data.setValueTextSize(9f);

            mChart.setData(data);
        }
    }

    protected float getRandom(float range, float startsfrom) {
        return (float) (Math.random() * range) + startsfrom;
    }
}

2: xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.github.mikephil.charting.charts.LineChart
        android:layout_gravity="center"
        android:id="@+id/line_chart"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffffff"
         >


    </com.github.mikephil.charting.charts.LineChart>

</LinearLayout>

3:  自定义  MyXFormatter

package com.welleplus.yfinspection.formatter;

import android.util.Log;

import com.github.mikephil.charting.components.AxisBase;
import com.github.mikephil.charting.formatter.IAxisValueFormatter;

/**
 * Description:
 * Author:zhangmengmeng
 * Date:2018/2/6
 * Time:上午9:53
 */

public class MyXFormatter implements IAxisValueFormatter {

    private static final String TAG = "MyXFormatter";
    private int count;

    public MyXFormatter(int count) {

        this.count = count;
    }

    public MyXFormatter( ) {

    }
    /**
     * @param value
     * @param axis
     * @return
     */
    @Override
    public String getFormattedValue(float value, AxisBase axis) {

        Log.i(TAG, "getFormattedValue: ------------calue:"+value);

        int data = (int) value;

        String x="";
        String y="";

        for(int i=0;i<24;i++){
            int j= data - i * 60;
            if(j>=0 && j<59 ){

                x=i+"";
                y=j+"";

                Log.i(TAG, "getFormattedValue: --------x:"+x+"---y: "+y);

            }
        }
        if(x.length()<2){
            x="0"+x;
        }
        if(y.length()<2){
            y="0"+y;
        }

        return x+":"+y;
    }
}

4: 使用方式

  mChart = helper.getView(R.id.chart);
  mChart.initChartData(mChartReverses);

5: 获取X轴值

  // 时 * 分钟
    public static long hourMultiMin(String time) {

        if (TextUtils.isEmpty(time)) {
            return 0;
        }
        String data = time;
        if (time.contains(".0")) {
            data = time.replace(".0", "");
        }

        try {
            if (data.contains(" ") && data.contains(":")) {
                String[] split = data.split(" ");

                String time2 = split[1];
                String[] split1 = time2.split(":");

                return Long.parseLong(split1[0]) * 60+Long.parseLong(split1[1]);
            }else{
                return 0;
            }
        } catch (Exception e) {
            return 0;
        }
    }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值