Android MPAndroidChart开源库图表之折线图的实例代码

6
回复
1583
查看
[复制链接]

503

主题

1199

帖子

2026

安币

手工艺人

发表于 2018-6-5 14:09:08 | 显示全部楼层 |阅读模式

            

        本文讲述了android mpandroidchart开源库图表之折线图的实例代码。分享给大家供大家参考,具体如下:

        承接上一篇文章,请参考android hellochart开源库图表之折线图的实例代码

        1. 将mpandroidchartlibrary-2-0-8.jar包copy到项目的libs中;

        2. 定义xml文件。

        


        3. 主要java逻辑代码如下,注释已经都添加上了。

[Java] 查看源文件 复制代码
package com.example.mpandroidlinechart; 
import java.util.arraylist; 
import com.github.mikephil.charting.charts.linechart; 
import com.github.mikephil.charting.components.legend; 
import com.github.mikephil.charting.components.legend.legendform; 
import com.github.mikephil.charting.data.entry; 
import com.github.mikephil.charting.data.linedata; 
import com.github.mikephil.charting.data.linedataset; 
import android.support.v7.app.actionbaractivity; 
import android.graphics.color; 
import android.os.bundle; 
public class mainactivity extends actionbaractivity { 
 private linechart mlinechart; 
// private typeface mtf; 
 @override 
 protected void oncreate(bundle savedinstancestate) { 
 super.oncreate(savedinstancestate); 
 setcontentview(r.layout.activity_main); 
 mlinechart = (linechart) findviewbyid(r.id.spread_line_chart); 
// mtf = typeface.createfromasset(getassets(), "opensans-bold.ttf"); 
 linedata mlinedata = getlinedata(36, 100); 
 showchart(mlinechart, mlinedata, color.rgb(114, 188, 223)); 
 } 
 // 设置显示的样式 
 private void showchart(linechart linechart, linedata linedata, int color) { 
 linechart.setdrawborders(false); //是否在折线图上添加边框 
 // no description text 
 linechart.setdescription("");// 数据描述 
 // 如果没有数据的时候,会显示这个,类似listview的emtpyview 
 linechart.setnodatatextdescription("you need to provide data for the chart."); 
 // enable / disable grid background 
 linechart.setdrawgridbackground(false); // 是否显示表格颜色 
 linechart.setgridbackgroundcolor(color.white & 0x70ffffff); // 表格的的颜色,在这里是是给颜色设置一个透明度 
 // enable touch gestures 
 linechart.settouchenabled(true); // 设置是否可以触摸 
 // enable scaling and dragging 
 linechart.setdragenabled(true);// 是否可以拖拽 
 linechart.setscaleenabled(true);// 是否可以缩放 
 // if disabled, scaling can be done on x- and y-axis separately 
 linechart.setpinchzoom(false);// 
 linechart.setbackgroundcolor(color);// 设置背景 
 // add data 
 linechart.setdata(linedata); // 设置数据 
 // get the legend (only possible after setting data) 
 legend mlegend = linechart.getlegend(); // 设置比例图标示,就是那个一组y的value的 
 // modify the legend ... 
 // mlegend.setposition(legendposition.left_of_chart); 
 mlegend.setform(legendform.circle);// 样式 
 mlegend.setformsize(6f);// 字体 
 mlegend.settextcolor(color.white);// 颜色 
// mlegend.settypeface(mtf);// 字体 
 linechart.animatex(2500); // 立即执行的动画,x轴 
 } 
 /** 
 * 生成一个数据 
 * @param count 表示图表中有多少个坐标点 
 * @param range 用来生成range以内的随机数 
 * @return 
 */ 
 private linedata getlinedata(int count, float range) { 
 arraylist<string> xvalues = new arraylist<string>(); 
 for (int i = 0; i < count; i++) { 
 // x轴显示的数据,这里默认使用数字下标显示 
 xvalues.add("" + i); 
 } 
 // y轴的数据 
 arraylist<entry> yvalues = new arraylist<entry>(); 
 for (int i = 0; i < count; i++) { 
 float value = (float) (math.random() * range) + 3; 
 yvalues.add(new entry(value, i)); 
 } 
 // create a dataset and give it a type 
 // y轴的数据集合 
 linedataset linedataset = new linedataset(yvalues, "测试折线图" /*显示在比例图上*/); 
 // mlinedataset.setfillalpha(110); 
 // mlinedataset.setfillcolor(color.red); 
 //用y轴的集合来设置参数 
 linedataset.setlinewidth(1.75f); // 线宽 
 linedataset.setcirclesize(3f);// 显示的圆形大小 
 linedataset.setcolor(color.white);// 显示颜色 
 linedataset.setcirclecolor(color.white);// 圆形的颜色 
 linedataset.sethighlightcolor(color.white); // 高亮的线的颜色 
 arraylist<linedataset> linedatasets = new arraylist<linedataset>(); 
 linedatasets.add(linedataset); // add the datasets 
 // create a data object with the datasets 
 linedata linedata = new linedata(xvalues, linedatasets); 
 return linedata; 
 } 
} 

        效果图如下:

        


        折线图还有另外一种表现形式,就是折线平滑,然后折线与x轴之间可以任意填充自己想要的颜色,其实就是一些属性设置的问题,代码如下:

        在上面的getlinedata()函数中添加自己的设置:

        


        效果图如下:

        


        关于mpandroidchart填充式的折线图网上的帖子很少,基本没有。这个是自己在网上搜索其他开源图表库,如jfreechart...加上自己看源码才总结出来的,不知道对不对,但是看效果,基本上没问题。如果大家发现有问题,欢迎大家指正!






        

0

主题

9524

帖子

1139

安币

Android大神

Rank: 6Rank: 6

发表于 2018-6-5 14:54:12 | 显示全部楼层
感谢分享,安卓巴士有你更精彩:lol

497

主题

1244

帖子

1029

安币

手工艺人

发表于 2018-6-5 16:25:40 | 显示全部楼层
感谢分享,楼主V5~

314

主题

1064

帖子

681

安币

手工艺人

发表于 2018-6-5 17:29:40 | 显示全部楼层
感谢分享,楼主V5~

7

主题

9633

帖子

1958

安币

Android大神

Rank: 6Rank: 6

发表于 2018-6-5 18:14:15 | 显示全部楼层
楼主是好人,回个帖会有安币吗?

7

主题

1万

帖子

2316

安币

Android大神

Rank: 6Rank: 6

发表于 2018-6-5 19:09:07 | 显示全部楼层
安卓巴士是个不错的网站,我来顶个贴~

6

主题

9578

帖子

2862

安币

Android大神

Rank: 6Rank: 6

发表于 2018-6-5 20:05:48 | 显示全部楼层
楼主威武,以后多发干货,多办活动~!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )