hellocharts的基础使用

最新推荐文章于 2022-03-23 14:18:46 发布
最新推荐文章于 2022-03-23 14:18:46 发布
阅读量4.4k 收藏 22
点赞数 7
分类专栏： android 文章标签： 安卓 android java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43627076/article/details/117742065
版权

HelloCharts的基本使用

在线导入hellocharts步骤

这里以android studio为例
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
这里输入全称才可以实现下载，搜到结果之后点击ok就开始下载了，如果下载之后启动app发现闪退，需要在build.gradle中文件中找到下面这一行
在这里插入图片描述
像图中这样加上一个@aar即可

基本使用

（1）布局文件的内容，这里没什么好说的，就是添加一个LineChartView组件

<lecho.lib.hellocharts.view.LineChartView
    android:id="@+id/linechart_one"
    android:background="#00FFFF"
    android:layout_weight="1"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</lecho.lib.hellocharts.view.LineChartView>

（2）MainActivity.java

所需属性

//对应xml中的LineChartView
private LineChartView lineChartView;
// x轴数据
private String[] data = {"1s前", "2s前", "3s前", "4s前", "5s前", "6s前", "7s前", "8s前", "9s前", "10s前"};
// 每个点的y轴数据 
private Float[] score = {Float.valueOf(541), Float.valueOf(429), Float.valueOf(865), Float.valueOf(901), Float.valueOf(503), Float.valueOf(787), Float.valueOf(222), Float.valueOf(666), Float.valueOf(800), Float.valueOf(525)};
// X轴对象
private List<AxisValue> axisValues = new ArrayList<AxisValue>();
// Y轴对象
private List<PointValue> pointValues = new ArrayList<PointValue>();

//折线集合  用于存放多个折线，即可以显示多条折线
private List<Line> lines = new ArrayList<>();
//折线图数据对象
private LineChartData lData = new LineChartData();

初始化X，Y轴数据

private void  initData(){
    for (int i = 0; i < 10; i++) {
        axisValues.add(new AxisValue(i).setLabel(data[i]));
        pointValues.add(new PointValue(i, score[i]));
    }
}

创建一条折线

这里可以生成多条折线，然后添加到折线列表即可

/**
     * 创建一条线   这里可以创建多条线然后添加到lines中即可
     */
    private void createLine(){
        Line mLine = new Line();
        // 为线添加点
        mLine.setValues(pointValues);

        //设置线的颜色
        mLine.setColor(Color.parseColor("#5699BB"));

        //曲线是否平滑，即是曲线还是折线
//        mLine.setCubic(true);

        //设置点的形状
        mLine.setShape(ValueShape.SQUARE);

        //设置点击坐标提醒  平常不显示 点击才显示
//        mLine.setHasLabelsOnlyForSelected(true);

        //取消线
//        mLine.setHasLines(false);


        //是否填充面积
        mLine.setFilled(true);

        //设置坐标数据显示
        mLine.setHasLabels(true);
        //将所有的线都添加到线的集合中
        lines.add(mLine);
    }

设置横纵坐标

private void createXAndY(){
    //设置X轴
    Axis axisX = new Axis(); //X轴
    //X坐标轴字体是斜的显示还是直的，true是斜的显示
    axisX.setHasTiltedLabels(true);
    //设置字体颜色
    axisX.setTextColor(Color.parseColor("#1C1C1C"));
    //设置字体大小
    axisX.setTextSize(15);
    //最多几个X轴坐标，意思就是你的缩放让X轴上数据的个数7<=x<=mAxisXValues.length
    axisX.setMaxLabelChars(2);
    //填充X轴的坐标名称
    axisX.setValues(axisValues);

    //设置标题
    axisX.setName("三点零零零零");

    //设置是否拥有轴的分界线
    axisX.setHasLines(true);

    lData.setAxisXBottom(axisX); //x 轴在底部


    // Y轴是根据数据的大小自动设置Y轴上限(在下面我会给出固定Y轴数据个数的解决方案)
    Axis axisY = new Axis();  //Y轴
    axisY.setName("");//y轴标注
    axisY.setTextSize(10);//设置字体大小
    lData.setAxisYLeft(axisY);  //Y轴设置在左边
    //data.setAxisYRight(axisY);  //y轴设置在右边


}

oncreate

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        lineChartView = findViewById(R.id.linechart_one);
        initData();
        createLine();
        createXAndY();

        lData.setLines(lines);

        //把数据对象设置到折线图中
        lineChartView.setLineChartData(lData);

        //设置是否允许平移和缩放
//        lineChartView.setInteractive(false);

        //设置缩放的轴
        lineChartView.setZoomType(ZoomType.HORIZONTAL);

        //设置缩放的倍数
        lineChartView.setMaxZoom(5);
    }

最终代码

package com.example.daythree2021_6_9;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.view.View;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

import lecho.lib.hellocharts.gesture.ContainerScrollType;
import lecho.lib.hellocharts.gesture.ZoomType;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.AxisValue;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.ValueShape;
import lecho.lib.hellocharts.view.LineChartView;

public class MainActivity extends AppCompatActivity {

    private LineChartView lineChartView;
    // x轴数据
    private String[] data = {"1s前", "2s前", "3s前", "4s前", "5s前", "6s前", "7s前", "8s前", "9s前", "10s前"};
    // 每个点的y轴数据
    private Float[] score = {Float.valueOf(541), Float.valueOf(429), Float.valueOf(865), Float.valueOf(901), Float.valueOf(503), Float.valueOf(787), Float.valueOf(222), Float.valueOf(666), Float.valueOf(800), Float.valueOf(525)};
    private List<AxisValue> axisValues = new ArrayList<AxisValue>();
    private List<PointValue> pointValues = new ArrayList<PointValue>();

    //折线集合  用于存放多个折线，即可以显示多条折线
    private List<Line> lines = new ArrayList<>();
    //折线图数据对象
    private LineChartData lData = new LineChartData();
    private void  initData(){
        for (int i = 0; i < 10; i++) {
            axisValues.add(new AxisValue(i).setLabel(data[i]));
            pointValues.add(new PointValue(i, score[i]));
        }
    }

    /**
     * 创建一条线   这里可以创建多条线然后添加到lines中即可
     */
    private void createLine(){
        Line mLine = new Line();
        // 为线添加点
        mLine.setValues(pointValues);

        //设置线的颜色
        mLine.setColor(Color.parseColor("#5699BB"));

        //曲线是否平滑，即是曲线还是折线
//        mLine.setCubic(true);

        //设置点的形状
        mLine.setShape(ValueShape.SQUARE);

        //设置点击坐标提醒  平常不显示 点击才显示
//        mLine.setHasLabelsOnlyForSelected(true);

        //取消线
//        mLine.setHasLines(false);


        //是否填充面积
        mLine.setFilled(true);

        //设置坐标数据显示
        mLine.setHasLabels(true);
        //将所有的线都添加到线的集合中
        lines.add(mLine);
    }

    /**
     * 对x轴和y轴进行配置
     */
    private void createXAndY(){
        //设置X轴
        Axis axisX = new Axis(); //X轴
        //X坐标轴字体是斜的显示还是直的，true是斜的显示
        axisX.setHasTiltedLabels(true);
        //设置字体颜色
        axisX.setTextColor(Color.parseColor("#1C1C1C"));
        //设置字体大小
        axisX.setTextSize(15);
        //最多几个X轴坐标，意思就是你的缩放让X轴上数据的个数7<=x<=mAxisXValues.length
        axisX.setMaxLabelChars(2);
        //填充X轴的坐标名称
        axisX.setValues(axisValues);

        //设置标题
        axisX.setName("三点零零零零");

        //设置是否拥有轴的分界线
        axisX.setHasLines(true);

        lData.setAxisXBottom(axisX); //x 轴在底部


        // Y轴是根据数据的大小自动设置Y轴上限(在下面我会给出固定Y轴数据个数的解决方案)
        Axis axisY = new Axis();  //Y轴
        axisY.setName("");//y轴标注
        axisY.setTextSize(10);//设置字体大小
        lData.setAxisYLeft(axisY);  //Y轴设置在左边
        //data.setAxisYRight(axisY);  //y轴设置在右边


    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        lineChartView = findViewById(R.id.linechart_one);
        initData();
        createLine();
        createXAndY();

        lData.setLines(lines);

        //把数据对象设置到折线图中
        lineChartView.setLineChartData(lData);

        //设置是否允许平移和缩放
//        lineChartView.setInteractive(false);

        //设置缩放的轴
        lineChartView.setZoomType(ZoomType.HORIZONTAL);

        //设置缩放的倍数
        lineChartView.setMaxZoom(5);
    }
}

运行结果

在这里插入图片描述

小王不头秃
关注
  • 7
    点赞
  • 踩
  • 22
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
开源的HelloCharts源码修改实现动态画折线图
11-03
Android中对HelloChart的修改，实现动态绘制折线图
简单的HelloCharts使用示例
06-07
通过使用HelloCharts实现简单的折线图、饼状图和柱状图
hellocharts使用流程
phenixyf的专栏
10-26 710
参考：http://blog.csdn.net/phenixyf/article/details/52513373
hellocharts
11-28
hellocharts-android使用demo，中文版使用详解，附带一些具体使用中遇到的小问题
Hellocharts超简单源码
烈火苍穹的博客
11-30 474
由于项目中只要求这三种图表，所以其他样式的图标没有涉猎。网上关于Hellocharts的教程很多，这里我就不多说了，直接上源码。其中，折线图有两条，用于对比数据。下载源码
AS导入hellocharts时遇到的问题
weixin_44759237的博客
03-23 702
hellocharts的GitHub地址 https://links.jianshu.com/go?to=https://github.com/lecho/hellocharts-android/ 在跟着README导入jar包,代码如下 dependencies{ compile 'com.github.lecho:hellocharts-library:1.5.8@aar' } 会得到错误 Could not find method compile() for arguments [com
Android使用HelloCharts绘制多曲线图
07-07
在本文中，我们将深入探讨如何在Android项目中使用HelloCharts库来绘制多曲线图。首先，你需要将HelloCharts库添加到你的项目依赖中。通常，你可以通过在`build.gradle`文件中添加以下依赖来实现： ```groovy ...
hellocharts libs
01-29
描述中提到，“hellocharts的libs，复制到libs下直接在activity中使用hellochart”，这表明这个压缩包包含的是HelloCharts库的Java或aar文件，你需要将这些文件添加到你的Android项目的libs目录下。然后，通过构建...
helloChart的使用及常见问题解决（折线图）
fsx_xiaomei的博客
08-29 4083
最近项目中有展示折线图和圆形图的需求，决定使用helloChart。这篇博客主要记录直线图和圆形图的使用，和在使用过程中遇到的问题。 - 折线图和圆形图的使用 - 解决折线图使用过程中发现的问题 a.修改折线图标点的样式(这里将其改为了空心) b.解决折线图坐标点全为相同（包括全为0）时折线不展示的问题 c.怎样隔点展示坐标 d.怎样固定折线图X轴展示个数
安卓折线图表之Hellocharts和MPAndroidChart实例
LeBang的博客
09-14 5648
本文主要对HelloCharts和MPAndroidChart的折线图的简单Demo，代码可以直接拿走使用 Hellocharts和MPAndroidChart各有优劣，个人觉得，Hellocharts在效果展示及动态处理上更亲和用户，而MPAndroidChart则在图表处理能力上更胜一筹， 两者的代码调用极其相似。
HelloCharts自定义Y轴
12-29
HelloCharts自定义Y轴颜色，可分层显示，同时折线及条形可以根据所在分层在头部匹配分层颜色，效果见我的博客
MpAdnroidChart:LineChart演示
05-12
MpAdnroidChart 折线图demo
HelloCharts最新源码，Eclipse中运行
01-19
HelloCharts最新源码，Eclipse中运行，分享给大家，欢迎下载！
hellochart
05-26
折线图demo eclipse版本
简单详细，开源的helloChart 图表开发
02-10
图表开发工具，自测ok，能用0202020202020202020
HelloChart折线图动态刷新--模拟心电图效果
热门推荐
wangwj650的博客
05-03 1万+
通过HelloCharts绘制折线图，利用定时器完成动态刷新，模拟实现心电图效果
HelloChart--PreviewChartView（预览统计图）
水易人间的专栏
10-20 1062
PreviewColumnChartView、PreviewLineChartView相当于是柱形图、折线图的预览模式，当柱形图与折线图数据过多，就可以通过预览图对其进行展示，用户可通过点击其中一部分进行放大查看。而且PreviewColumnChartView、PreviewLineChartView与ColumnChartView、LineChartView属性类似，只是多了一个预览图效果。
HelloChart折线图
11-23
Android helloChart 统计图表之折线图 blog地址http://blog.csdn.net/wwdlss
HelloCharts文档
最新发布
05-20
使用 HelloCharts 时，你需要在 build.gradle 文件中添加以下依赖项： ```groovy dependencies { implementation 'com.github.lecho:hellocharts-library:1.5.8@aar' } ``` 然后，你可以在布局文件中添加一个 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小王不头秃

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值