Android LineChart绘制多条曲线的方法

本文实例为大家分享了android linechart绘制多条曲线的具体代码，供大家参考，具体内容如下

目标效果：

1.新建custom_marker_view.xml页面作为点击弹出框的页面：

<?xml version="1.0" encoding="utf-8"?>
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="wrap_content"
 android:layout_height="40dp"
 android:background="@drawable/marker2" >
 
 <textview
 android:id="@+id/tvcontent"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_centerhorizontal="true"
 android:layout_margintop="7dp"
 android:layout_marginleft="5dp"
 android:layout_marginright="5dp"
 android:text=""
 android:textsize="12dp"
 android:textcolor="@android:color/white"
 android:ellipsize="end"
 android:singleline="true"
 android:textappearance="?android:attr/textappearancesmall" />
 
</relativelayout>

2.activity_main.xml页面：

<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:paddingbottom="10dp"
 android:paddingleft="10dp"
 android:paddingright="10dp"
 android:paddingtop="10dp"
 tools:context=".mainactivity" >
 
 <com.github.mikephil.charting.charts.linechart
 android:id="@+id/charttall"
 android:layout_width="match_parent"
 android:layout_height="400dp"
 android:layout_margintop="20dp" />
 
 
</relativelayout>

3.新建mymarkerview.java重写markview控件：

package com.example.weixu.drawline;
 
import android.content.context;
import android.widget.textview;
 
import com.github.mikephil.charting.data.candleentry;
import com.github.mikephil.charting.data.entry;
import com.github.mikephil.charting.utils.markerview;
import com.github.mikephil.charting.utils.utils;
 
public class mymarkerview extends markerview {
 
 private textview tvcontent;
 
 public mymarkerview(context context, int layoutresource) {
 super(context, layoutresource);
 
 tvcontent = (textview) findviewbyid(r.id.tvcontent);
 }
 
 @override
 public void refreshcontent(entry e, int datasetindex) {
 
 if (e instanceof candleentry) {
 candleentry ce = (candleentry) e;
 tvcontent.settext("" + utils.formatnumber(ce.gethigh(), 0, true));
 } else {
 tvcontent.settext("" +e.getval());
 }
 }
}

4.mainactivity.java页面：

package com.example.weixu.drawline;
 
import java.util.arraylist;
 
import android.app.activity;
import android.graphics.color;
import android.graphics.typeface;
import android.os.bundle;
import android.view.windowmanager;
 
import com.github.mikephil.charting.charts.barlinechartbase;
import com.github.mikephil.charting.charts.barlinechartbase.borderposition;
import com.github.mikephil.charting.charts.linechart;
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.utils.legend;
import com.github.mikephil.charting.utils.legend.legendform;
import com.github.mikephil.charting.utils.xlabels;
import com.github.mikephil.charting.utils.xlabels.xlabelposition;
import com.github.mikephil.charting.utils.ylabels;
 
public class mainactivity extends activity {
 
 private linechart charttall;
 
 @override
 protected void oncreate(bundle savedinstancestate) {
 super.oncreate(savedinstancestate);
 getwindow().setflags(windowmanager.layoutparams.flag_fullscreen,
 windowmanager.layoutparams.flag_fullscreen);
 setcontentview(r.layout.activity_main);
 
 charttall = (linechart) findviewbyid(r.id.charttall);
 
 settype();
 
 // 刷新图表
 charttall.invalidate();
 }
 
 private void settype() {
 // 设置在y轴上是否是从0开始显示
 charttall.setstartatzero(true);
 //是否在y轴显示数据，就是曲线上的数据
 charttall.setdrawyvalues(true);
 //设置网格
 charttall.setdrawborder(true);
 charttall.setborderpositions(new barlinechartbase.borderposition[] {
 borderposition.bottom});
 //在chart上的右下角加描述
 charttall.setdescription("身高曲线图");
 //设置y轴上的单位
 charttall.setunit("cm");
 //设置透明度
 charttall.setalpha(0.8f);
 //设置网格底下的那条线的颜色
 charttall.setbordercolor(color.rgb(213, 216, 214));
 //设置y轴前后倒置
 charttall.setinvertyaxisenabled(false);
 //设置高亮显示
 charttall.sethighlightenabled(true);
 //设置是否可以触摸，如为false，则不能拖动，缩放等
 charttall.settouchenabled(true);
 //设置是否可以拖拽，缩放
 charttall.setdragenabled(true);
 charttall.setscaleenabled(true);
 //设置是否能扩大扩小
 charttall.setpinchzoom(true);
 //设置点击chart图对应的数据弹出标注
 mymarkerview mv = new mymarkerview(this, r.layout.custom_marker_view);
 mv.setoffsets(-mv.getmeasuredwidth() / 2, -mv.getmeasuredheight());
 charttall.setmarkerview(mv);
 charttall.sethighlightindicatorenabled(false);
 //设置字体格式，如正楷
 typeface tf = typeface.createfromasset(getassets(),
 "opensans-regular.ttf");
 charttall.setvaluetypeface(tf);
 
 xlabels xl = charttall.getxlabels();
 xl.setposition(xlabelposition.bottom); // 设置x轴的数据在底部显示
 xl.settypeface(tf); // 设置字体
 xl.settextsize(10f); // 设置字体大小
 xl.setspacebetweenlabels(3); // 设置数据之间的间距
 
 ylabels yl = charttall.getylabels();
 yl.settypeface(tf); // 设置字体
 yl.settextsize(10f); // s设置字体大小
 yl.setlabelcount(5); // 设置y轴最多显示的数据个数
 // 加载数据
 setdata();
 //从x轴进入的动画
 charttall.animatex(4000);
 charttall.animatey(3000); //从y轴进入的动画
 charttall.animatexy(3000, 3000); //从xy轴一起进入的动画
 
 //设置最小的缩放
 charttall.setscaleminima(0.5f, 1f);
 
 }
 
 private void setdata() {
 string[] babage = {"0","1","2","3","4","5","6"}; //连线的x轴数据
 string[] babytall = {"50","60","90","110","130","135","140"};
 string[] usuatall = {"55","65","95","115","125","135","145"};//连线的y轴数据
 
 linedata data=new linedata(babage,setline(babage,babytall,1,"宝宝身高")); //创建linedata实体类并添加第一条曲线
 data.adddataset(setline(babage,usuatall,2,"正常身高")); //添加第二条曲线
 charttall.setdata(data);
 }
 
 //画线
 private linedataset setline(string[] babage, string[] tall,int flag,string name) {
 arraylist<string> xvalsage = new arraylist<string>();
 for (int i = 0; i < babage.length; i++) {
 xvalsage.add(babage[i]);
 }
 arraylist<entry> yvalsbabytall = new arraylist<entry>();
 for (int i = 0; i < tall.length; i++) {
 yvalsbabytall.add(new entry(float.parsefloat(tall[i]), i));
 }
 //设置baby的成长曲线
 linedataset setdata = new linedataset(yvalsbabytall,name);
 setdata.setdrawcubic(true); //设置曲线为圆滑的线
 setdata.setcubicintensity(0.2f);
 setdata.setdrawfilled(false); //设置包括的范围区域填充颜色
 setdata.setdrawcircles(true); //设置有圆点
 setdata.setlinewidth(2f); //设置线的宽度
 setdata.setcirclesize(5f); //设置小圆的大小
 setdata.sethighlightcolor(color.rgb(244, 117, 117));
 //设置曲线颜色
 if(flag==1)
 setdata.setcolor(color.rgb(104, 241, 175)); //宝宝身高曲线颜色
 else if(flag==2)
 setdata.setcolor(color.rgb(255, 0, 0)); //普通身高曲线颜色
 return setdata; //返回曲线
 }
}

源码：点击打开链接

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。