Android 图标控件 Hellocharts使用手册
来源:互联网 发布:淘宝联盟app下载 编辑:程序博客网 时间:2024/06/11 10:48
引言:最近因为公司业务需求需要做一个访问统计的模块,设计到图表控件比较大,在Github看了一下,hellochats这个控件大家用了最后反映很好,我下了个demo研究了下。
- 什么hellochats
https://github.com/lecho/hellocharts-android
这个github链接,有兴趣可以去看看。主要就是一个包含折线图,柱状图,饼状图的图形框架,功能强大,自由度高。
- 折线图的相关实现
<lecho.lib.hellocharts.view.LineChartView android:id="@+id/chart" android:layout_marginBottom="10dp" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:layout_marginLeft="10dp" android:layout_marginRight="10dp"/>
布局文件声明具体应用类型。
private LineChartData data; private long MaxY=0;//y轴最大值 private void generateData() {//初始化数据 MaxY = 0; List<Line> lines = new ArrayList<Line>();//折现集合(可以有多根折线) List<PointValue> values = new ArrayList<PointValue>();//每根折线上的点的集合(每个点包括xy坐标) for (int j = 0; j< Acclist.size(); ++j) { values.add(new PointValue(j, Acclist.get(j).getPv()));//添加Y轴数据 MaxY = Math.max(MaxY,Acclist.get(j).getPv());//取出Y轴最大数据 } Line line = new Line(values); line.setColor(Color.parseColor("#FF6600"));//设置折线的颜色 line.setShape(ValueShape.CIRCLE);//节点图形样式 DIAMOND菱形、SQUARE方形、CIRCLE圆形 line.setCubic(true);//曲线是否平滑,即是曲线还是折线 line.setFilled(true);//是否填充曲线的面积 line.setHasLabels(false);//曲线的数据坐标是否加上备注 line.setHasLabelsOnlyForSelected(true);//点击数据坐标提示数据(设置了这个line.setHasLabels(true);就无效) line.setHasLines(true);//是否用线显示。如果为false 则没有曲线只有点显示 line.setHasPoints(true);//是否显示圆点 如果为false 则没有原点只有点显示(每个数据点都是个大的圆点) line.setPointRadius(3);//设置节点半径 line.setPointColor(Color.RED);//设置节点颜色 lines.add(line); data = new LineChartData(lines); Axis axisY = new Axis().setHasLines(true); axisY.setName(""); List<AxisValue> axisValues = new ArrayList<AxisValue>(); for (int i = 0; i < arrayTimekey.length; i ++) { axisValues.add(new AxisValue(i).setLabel(DateUtils.parseToStringStyle(arrayTimekey[i].toString(),DateUtils.Simple_Date_Format,"yyyy/MM/dd"))); } //坐标轴 Axis axisX = new Axis(); //X轴 axisX.setHasTiltedLabels(true); //X坐标轴字体是斜的显示还是直的,true是斜的显示 //axisX.setTextColor(Color.BLACK); //设置字体颜色 axisX.setName("日期"); //表格名称 axisX.setHasLines(true); //x 轴分割线 axisX.setTextSize(12);//设置字体大小 axisX.setMaxLabelChars(10); //最多几个X轴坐标,意思就是你的缩放让X轴上数据的个数7<=x<=mAxisXValues.length axisX.setValues(axisValues); //填充X轴的坐标名称 data.setAxisXBottom(axisX); //x 轴在底部 //data.setAxisXTop(axisX); //x 轴在顶部 data.setAxisYLeft(axisY);//Y轴设置在左边 data.setBaseValue(Float.NEGATIVE_INFINITY); resetViewport(); } private void resetViewport() { //设置行为属性,支持缩放、滑动以及平移 chart.setInteractive(true); chart.setZoomType(ZoomType.HORIZONTAL); chart.setMaxZoom((float) arrayTimekey.length);//最大方法比例 chart.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL); chart.setLineChartData(data); chart.setVisibility(View.VISIBLE); chart.setValueSelectionEnabled(true);//设置节点点击后动画 /**注:下面的7,10只是代表一个数字去类比而已 * 当时是为了解决X轴固定数据个数。见(http://forum.xda-developers.com/tools/programming/library-hellocharts-charting-library-t2904456/page2); 这4句代码可以设置X轴数据的显示个数(x轴0-7个数据), 1 当数据点个数小于(29)的时候,缩小到极致hellochart默认的是所有显示。 2 当数据点个数大于(29)的时候, 2.1 若不设置axisX.setMaxLabelChars(int count)这句话,则会自动适配X轴所能显示的尽量合适的数据个数。 2.2 若设置axisX.setMaxLabelChars(int count)这句话, 33个数据点测试, 2.2.1 若 axisX.setMaxLabelChars(10); 里面的10大于v.right= 7; 里面的7,则 刚开始X轴显示7条数据,然后缩放的时候X轴的个数会保证大于7小于10 2.2.2 若小于v.right= 7;中的7,反正我感觉是这两句都好像失效了的样子 - -! 若这儿不设置 v.right= 7; 这句话,则图表刚开始就会尽可能的显示所有数据,交互性太差 */ final Viewport v = new Viewport(chart.getMaximumViewport()); v.bottom = 0; v.top = (MaxY+20); v.left = 0; v.right = 7; chart.setCurrentViewportWithAnimation(v); }
实例化Line(折线)需要传入点的集合,实例化LinerChat需要传入Lines的集合,以及传入调用 axisX.setValues(axisValues)将X轴坐标填入。
3. 饼状图使用
布局声明图表类型为饼状图
<lecho.lib.hellocharts.view.PieChartView android:layout_marginLeft="40dp" android:layout_marginRight="40dp" android:id="@+id/chart" android:layout_width="match_parent" android:layout_height="250dp" > </lecho.lib.hellocharts.view.PieChartView>
初始化饼状图数据
/** * 初始化饼状图数据 */ private PieChartData data; private void generateData() { List<SliceValue> values = new ArrayList<SliceValue>();//声明饼状图集合,主要存放每个扇形区域的数据数量和区域颜色 SliceValue sliceValue = new SliceValue(bean.getBaseShopFlow().getRefererPv().getDire(), parseColor("#FFE9C8"));//扇形区域的数据数量和区域颜色 SliceValue sliceValue = new SliceValue(bean.getBaseShopFlow().getRefererPv().getDire(), parseColor("#FFE9C8"));//扇形区域的数据数量和区域颜色 SliceValue sliceValue = new SliceValue(bean.getBaseShopFlow().getRefererPv().getDire(), parseColor("#FFE9C8"));//扇形区域的数据数量和区域颜色 values.add(sliceValue); data = new PieChartData(values); data.setHasLabels(true); data.setHasLabelsOnlyForSelected(false); data.setHasLabelsOutside(false); data.setHasCenterCircle(false); chart.setPieChartData(data); }
阅读全文
0 0
- Android 图标控件 Hellocharts使用手册
- Android开源图表控件hellocharts-android简单使用
- 开源控件hellocharts
- hellocharts-android 简单使用
- android hellocharts 环形图
- Android 统计框架hellocharts
- android helloCharts 柱状图小结
- HelloCharts
- HelloCharts
- Hellocharts-android 设置缩放级别
- Android hellocharts常见API总结
- 安卓学习笔记---图表控件 HelloCharts
- 浅谈hellocharts-android的初体验
- Android开源图表库:HelloCharts
- android图标库 hellocharts 遇到的坑
- hellocharts-android图表库之饼状图:PieChartView
- [Android]HelloCharts实现动态加载数据
- hellocharts-android图表库之柱状图:ColunmChartView
- Killer Names 2017 多校 8
- ios二维码的生成与二维码图片的扫描
- 运行时常量池
- 222
- Android APP多语言的添加
- Android 图标控件 Hellocharts使用手册
- 接口
- Android--顶部轮播图
- struct 的匿名成员
- Unknown return value type: java.lang.Integer
- Nginx获取客户端IP实现(亲测可用)
- Jsp + el表达式 + jstl
- 文章标题
- 04redis集群搭建