安卓MPAndroidChart绘制柱状图

2022-07-14 13:55:19 浏览数 (1)

首先是添加Jar包

进入Gradle Scripts的目录,添加Jar包都在这里

首先是Project这个的allprojects里面加上一行

代码语言:javascript复制
allprojects {
    repositories {
        google()
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

在app这个里面denpendencies中弄成这样子的

代码语言:javascript复制
dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'androidx.appcompat:appcompat:1.0.2'
    implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'androidx.test.ext:junit:1.1.0'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.1'
    implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
}

然后这是xml布局文件

代码语言:javascript复制
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:id="@ id/chart"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:orientation="vertical">
    <com.github.mikephil.charting.charts.BarChart
        android:id="@ id/barChart"
        android:layout_width="match_parent"
        android:layout_height="150dp" />
    </LinearLayout>
</LinearLayout>

然后这是Mainactivity的代码

代码语言:javascript复制
package ink.cik.echartsstu;

import android.os.Bundle;
import android.os.Trace;

import androidx.appcompat.app.AppCompatActivity;

import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Description;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main); //定义一下界面的控件
        BarChart barChart = findViewById(R.id.barChart);
        initBarChart(barChart); //初始化一个柱状图
        barChart.setData(setBarData()); //给柱状图添加数据
        barChart.invalidate(); //让柱状图填充数据后刷新
    }

    public BarData setBarData() {
        List<BarEntry> entries = new ArrayList<>(); //定义一个数据容器
        //生成随机数数据
        for (int i = 0; i <= 12; i  ) {
            entries.add(new BarEntry(i, new Random().nextInt(300)));
        }
        BarDataSet barDataSet = new BarDataSet(entries, "测试数据");
        BarData barData = new BarData(barDataSet);
        return barData; //返回可用于柱状图的数据
    }

    public BarChart initBarChart(BarChart barChart) {
        barChart.setDrawBarShadow(false); // 设置每条柱子的阴影不显示
        barChart.setDrawValueAboveBar(true); // 设置每条柱子的数值显示
        XAxis xAxis = barChart.getXAxis(); // 获取柱状图的x轴
        YAxis yAxisLeft = barChart.getAxisLeft(); // 获取柱状图左侧的y轴
        YAxis yAxisRight = barChart.getAxisRight(); // 获取柱状图右侧的y轴
        setAxis(xAxis, yAxisLeft, yAxisRight); //调用方法设置柱状图的轴线
        return barChart;
    }

    public void setAxis(XAxis xAxis, YAxis leftAxis, YAxis rightAxis) {
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); // 这里设置x轴在柱状图底部显示
        xAxis.setAxisLineWidth(1); //设置x轴宽度
        xAxis.setAxisMinimum(0); //设置x轴从0开始绘画
        xAxis.setDrawAxisLine(true); //设置x轴的轴线显示
        xAxis.setDrawGridLines(false);//设置x轴的表格线不显示
        xAxis.setEnabled(true); // 设置x轴显示

        leftAxis.setAxisMinimum(0); //设置y轴从0刻度开始
        leftAxis.setDrawGridLines(false); // 这里设置左侧y轴不显示表格线
        leftAxis.setDrawAxisLine(true); // 这里设置左侧y轴显示轴线
        leftAxis.setAxisLineWidth(1); //设置y轴宽度
        leftAxis.setEnabled(true); //设置左侧的y轴显示

        rightAxis.setAxisMinimum(0); //设置y轴从0刻度开始
        rightAxis.setDrawGridLines(false);// 这里设置右侧y轴不显示表格线
        rightAxis.setDrawAxisLine(true); // 这里设置右侧y轴显示轴线
        rightAxis.setAxisLineWidth(1); //设置右侧y轴宽度
        rightAxis.setEnabled(true); //设置右侧的y轴显示

    }
}
jar

0 人点赞