Android图表库HelloCharts的实例详解

 更新时间:2022年01月06日 15:27:56   作者:曲幽  
这篇文章主要介绍了Android中的图标库HelloCharts的一些简单使用实例,文中的示例代码讲解详细,对我们学习有一定的参考价值,需要的可以参考一下

概述

效果图,数据可平移查看历史

build.gradle

implementation 'com.github.lecho:hellocharts-library:1.5.8@aar'

layout

直接在布局中加入相应的图表控件

<lecho.lib.hellocharts.view.LineChartView
    android:id="@+id/ChartLine"
    android:layout_width="0dp"
    android:layout_height="300dp"
    android:padding="6dp"/>

常用图表类型

LineChartView

PointValue

图表上每一点的数据 PointValue(float x, float y)

第一个参数表示点的位置,第二个参数表示点上的数据。如果是多条折线,则需要为每一条拆线相同位置定义不同的PointValue

PointValue point1 = new PointValue(0, 1000);
PointValue point2 = new PointValue(1, 1500);
PointValue point1 = new PointValue(0, 1200);
PointValue point2 = new PointValue(1, 1600);

setLabel() 可以为数据点定义显示文本

point1.setLabel("202101");

实例

List<PointValue> valuesR = new ArrayList<>();
List<PointValue> valuesS = new ArrayList<>();
for (int i = 0; i < dataEntities.size(); i++) {
    DataEntity dataEntity = dataEntities.get(i);
    if (dataEntity.getDataR() < 3000 || dataEntity.getDataS() < 3000)
        continue;
    valuesR.add(new PointValue(i, dataEntity.getDataR()).setLabel(String.valueOf(dataEntity.getDataR())));
    valuesS .add(new PointValue(i, dataEntity.getDataS()).setLabel(String.valueOf(dataEntity.getDataS())));
}

如果数据太小,则跳过。数据不加载入数据点集合,但 i 索引会增加,折线上会出现大的间隔。如果不想出现此情况,可更换 for 循环为 foreach 循环,然后手动控制 i 的增长。

Line

定义线条上的数据和颜色等

构造函数传入包含PointValue的列表,有几条折线就创建几条并绑定不同的点数据列表

List<Line> lines = new ArrayList<>();
lines.add(new Line(valuesR).setColor(Color.RED).setCubic(false).setHasLabelsOnlyForSelected(true));
lines.add(new Line(valuesS).setColor(Color.BLUE).setCubic(false).setHasLabelsOnlyForSelected(true));

常用属性方法

  • setColor() # 设置折线颜色
  • setCubic(true) # 折线是否平滑,即是曲线还是折线
  • setShape() # 折线上数据点的形状,有三种 :ValueShape.SQUARE(方) ValueShape.CIRCLE(圆) ValueShape.DIAMOND(菱)
  • setFilled(false) # 是否填充曲线的面积
  • setHasLabels(true) # 曲线的数据坐标是否加上备注
  • setHasLabelsOnlyForSelected(true) # 同上,但是只有点击数据坐标提示数据,但设置了这个属性,上面的属性即失效
  • setHasLines(true) # 是否显示线,为false则只显示点
  • setHasPoints(true) # 是否显示圆点,如果为false则每个数据点都是个大的圆点

Axis

X轴

List<AxisValue> xValue = new ArrayList<>();
for(int i = 0; i < dataEntities.size(); i++){
    DataEntity dataEntity = dataEntities.get(i);
    xValue.add(new AxisValue(i).setLabel(dataEntity .getDate()));
}
Axis axisX = new Axis();
axisX.setHasTiltedLabels(true);
axisX.setTextColor(Color.GRAY);
axisX.setValues(xValue);

Y轴

List<AxisValue> yValue = new ArrayList<>();
for(int i = 0; i < 8000; i = i + 1000){
    yValue.add(new AxisValue(i).setLabel(String.valueOf(i)));
}
Axis axisY  = new Axis();
axisY.setTextColor(Color.GRAY);
axisY.setValues(yValue);
axisY.setHasLines(true);
LineChartData data = new LineChartData();
data.setLines(lines);
data.setAxisXBottom(axisX);
data.setAxisYLeft(axisY);

AxisValue

创建实例

AxisValue v = new AxisValue(i).setLabel(String.valueOf(i));

常用属性方法

  • setHasTiltedLabels(true) # 坐标轴字体是否显示斜体
  • setValues() # 填充数据列表
  • setHasLines(true) # 是否显示参考线

LineChartData

将以上包含了点数据列表的折线添加到 LineChartData 中并绑定给图表控件

Chart

//设置是否允许平移以及平移的方向
bindingView.chartLine.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);
//填充数据
bindingView.chartLine.setLineChartData(data);

实现平移必须设置视图大小

//实例化一个新的ViewPort 构造函数中传入填充数据后的默认最大视图
Viewport viewport = new Viewport(bindingView.chartLine.getMaximumViewport()); 
//设置y轴的显示
viewport.top = MyApplication.getSharedPreferences().getInt("max", 8000);
viewport.bottom = MyApplication.getSharedPreferences().getInt("min", 3000);
//一定要先设置最大视图范围
bindingView.chartLine.setMaximumViewport(viewport); //图表最大视图
//设置x轴的显示
viewport.right = MyApplication.getSharedPreferences().getInt("chart_right", 7);
viewport.left = 0;
//最后设置当前显示的视图范围
bindingView.chartLine.setCurrentViewport(viewport); //图表当前视图

完整代码

private void initChart(List<DataEntity> dataEntities) {
    List<PointValue> valuesR = new ArrayList<>();
    List<PointValue> valuesS = new ArrayList<>();
    List<AxisValue> xValue = new ArrayList<>();
    List<AxisValue> yValue = new ArrayList<>();
    for (int i = 0; i < dataEntities.size(); i++) {
        DataEntity dataEntity = dataEntities.get(i);
        if (dataEntity.getDataR() < MyApplication.getSharedPreferences().getInt("min", 3000) || dataEntity.getDataS() < MyApplication.getSharedPreferences().getInt("min", 3000))
            continue;
        valuesR.add(new PointValue(i, dataEntity .getDataR()).setLabel(String.valueOf(dataEntity .getDataR())));
        valuesS.add(new PointValue(i, dataEntity .getDataS()).setLabel(String.valueOf(dataEntity .getDataS())));
        xValue.add(new AxisValue(i).setLabel(dataEntity .getDate()));
    }
    for (int i = 0; i < MyApplication.getSharedPreferences().getInt("salary_max", 8000); i = i + 500) {
        yValue.add(new AxisValue(i).setLabel(String.valueOf(i)));
    }
    List<Line> lines = new ArrayList<>();
    lines.add(new Line(valuesR).setColor(Color.RED).setCubic(false).setHasLabelsOnlyForSelected(true));
    lines.add(new Line(valuesS).setColor(Color.BLUE).setCubic(false).setHasLabelsOnlyForSelected(true));
    Axis axisX = new Axis();
    axisX.setHasTiltedLabels(true);
    axisX.setTextColor(Color.GRAY);
    axisX.setValues(xValue);
    Axis axisY = new Axis();
    axisY.setTextColor(Color.GRAY);
    axisY.setValues(yValue);
    axisY.setHasLines(true);


    LineChartData data = new LineChartData();
    data.setLines(lines);
    data.setAxisXBottom(axisX);
    data.setAxisYLeft(axisY);
    bindingView.chartLine.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);
    bindingView.chartLine.setLineChartData(data);
    //设置图表显示的大小
    Viewport viewport = new Viewport(bindingView.chartLine.getMaximumViewport()); //填充数据后的默认最大视图
    viewport.top = MyApplication.getSharedPreferences().getInt("max", 8000);
    viewport.bottom = MyApplication.getSharedPreferences().getInt("min", 3000);
    bindingView.chartLine.setMaximumViewport(viewport); //图表最大视图
    viewport.right = MyApplication.getSharedPreferences().getInt("chart_right", 7);
    viewport.left = 0;
    bindingView.chartLine.setCurrentViewport(viewport); //图表当前视图
}

以上就是Android图表库HelloCharts的实例详解的详细内容,更多关于Android图表库HelloCharts的资料请关注脚本之家其它相关文章!

相关文章

  • Android 自定义控件详解及实例代码

    Android 自定义控件详解及实例代码

    这篇文章主要介绍了 Android 自定义控件详解及实例代码的相关资料,Android 系统自带控件有时候满足不了需求,就需要自己定义控件,需要的朋友可以参考下
    2017-03-03
  • Android 自定义加载动画Dialog弹窗效果的示例代码

    Android 自定义加载动画Dialog弹窗效果的示例代码

    这篇文章主要介绍了Android 自定义加载动画Dialog弹窗效果,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06
  • Android 游戏开发之Canvas画布的介绍及方法

    Android 游戏开发之Canvas画布的介绍及方法

    Android 游戏开发之Canvas画布的介绍及方法,需要的朋友可以参考一下
    2013-06-06
  • Android实现图片压缩示例代码

    Android实现图片压缩示例代码

    本篇文章主要介绍了Android实现图片压缩示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-01-01
  • Android studio 自动换行和取消自动换行操作

    Android studio 自动换行和取消自动换行操作

    这篇文章主要介绍了Android studio 自动换行和取消自动换行操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-04-04
  • Android模拟器中窗口截图存成文件实现思路及代码

    Android模拟器中窗口截图存成文件实现思路及代码

    Android模拟器内容是用OpenGL渲染的,所以用一般的编程截图(如PrintWindow()等)会是黑屏。这是因为画的东西放在framebuffer里 接下来介绍如何实现Android模拟器中窗口截图存成文件,感兴趣的朋友可以了解下哦
    2013-01-01
  • android闹铃简单实现

    android闹铃简单实现

    本文给大家分享的是一段简单的实现Android系统的闹铃的代码,非常实用,想做Android开发的小伙伴们可以参考下。
    2015-03-03
  • 使用Fragment来处理Andoird app的UI布局的实例分享

    使用Fragment来处理Andoird app的UI布局的实例分享

    这篇文章主要介绍了使用Fragment来处理Andoird appUI布局的实例分享,Fragment的出现缓解了代码依赖于Activity而造成的臃肿状况,需要的朋友可以参考下
    2016-02-02
  • Android实现强制下线功能的示例代码

    Android实现强制下线功能的示例代码

    这篇文章主要介绍了Android实现强制下线功能的示例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-07-07
  • Android实现语音播放与录音功能

    Android实现语音播放与录音功能

    这篇文章主要为大家详细介绍了Android实现语音播放与录音功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-07-07

最新评论