您当前的位置: 首页 >  ar

Kevin-Dev

暂无认证

  • 0浏览

    0关注

    544博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

【Android -- 开源库】MPAndroidChart 绘制曲线图、柱状图

Kevin-Dev 发布时间:2020-07-07 22:51:56 ,浏览量:0

在这里插入图片描述

前言

Android 平台绘图的开源库有好几个,最成熟最出名的就属于 MPAndroidChart 了,他能帮我们实现曲线图、折线图、柱状图、饼状图,分布图等等。同时还可以实现混合图表。

GitHub 地址:https://github.com/PhilJay/MPAndroidChart

  • 曲线图 在这里插入图片描述
  • 填充曲线图,可以设置纯色和渐变色 在这里插入图片描述
  • 混合图表 在这里插入图片描述
  • 柱状图 在这里插入图片描述
简介
  • 支持x,y轴缩放
  • 支持拖拽
  • 支持手指滑动
  • 支持高亮显示
  • 支持保存图表到文件中
  • 支持从文件(txt)中读取数据
  • 预先定义颜色模板
  • 自动生成标注
  • 支持自定义x,y轴的显示标签
  • 支持x,y轴动画
  • 支持x,y轴设置最大值和附加信息
  • 支持自定义字体,颜色,背景,手势,虚线等
使用

1. 在工程的 build.gradle 中添加如下:

allprojects {
    repositories {
        ...
        maven { url "https://www.jitpack.io" }
    }
}

2. 在 app/build.gradle 添加如下依赖:

implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
折线图(LineChart)

1. 管理类(LineChartManager.java)

public class LineChartManager {
    private LineChart lineChart;
    private YAxis leftAxis;
    private YAxis rightAxis;
    private XAxis xAxis;
    private LineData lineData;
    private LineDataSet lineDataSet;
    private List lineDataSets = new ArrayList();
    private SimpleDateFormat df = new SimpleDateFormat("HH:mm:ss");//设置日期格式  
    private List timeList = new ArrayList(); //存储x轴的时间

    //一条曲线
    public LineChartManager(LineChart mLineChart, String name, int color) {
        this.lineChart = mLineChart;
        leftAxis = lineChart.getAxisLeft();
        rightAxis = lineChart.getAxisRight();
        xAxis = lineChart.getXAxis();
        initLineChart();
        initLineDataSet(name, color);
    }

    //多条曲线
    public LineChartManager(LineChart mLineChart, List names, List colors) {
        this.lineChart = mLineChart;
        leftAxis = lineChart.getAxisLeft();
        rightAxis = lineChart.getAxisRight();
        xAxis = lineChart.getXAxis();
        initLineChart();
        initLineDataSet(names, colors);
    }

    /**
     * 初始化LineChar
     */
    private void initLineChart() {

        lineChart.setDrawGridBackground(false);
        //显示边界
        lineChart.setDrawBorders(true);
        //折线图例 标签 设置
        Legend legend = lineChart.getLegend();
        legend.setForm(Legend.LegendForm.LINE);
        legend.setTextSize(11f);
        //显示位置
        legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
        legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
        legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
        legend.setDrawInside(false);

        //X轴设置显示位置在底部
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setGranularity(1f);
        xAxis.setLabelCount(10);


        //保证Y轴从0开始,不然会上移一点
        leftAxis.setAxisMinimum(0f);
        rightAxis.setAxisMinimum(0f);
    }

    /**
     * 初始化折线(一条线)
     *
     * @param name
     * @param color
     */
    private void initLineDataSet(String name, int color) {

        lineDataSet = new LineDataSet(null, name);
        lineDataSet.setLineWidth(1.5f);
        lineDataSet.setCircleRadius(1.5f);
        lineDataSet.setColor(color);
        lineDataSet.setCircleColor(color);
        lineDataSet.setHighLightColor(color);
        //设置曲线填充
        lineDataSet.setDrawFilled(false);
        lineDataSet.setDrawValues(false);
        lineDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
        lineDataSet.setValueTextSize(10f);
        lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
        //添加一个空的 LineData
        lineData = new LineData();
        lineChart.setData(lineData);
        lineChart.invalidate();

    }

    /**
     * 初始化折线(多条线)
     *
     * @param names
     * @param colors
     */
    private void initLineDataSet(List names, List colors) {

        for (int i = 0; i  11) {
            timeList.clear();
        }

        timeList.add(df.format(System.currentTimeMillis()));

        Entry entry = new Entry(lineDataSet.getEntryCount(), number);
        lineData.addEntry(entry, 0);
        //通知数据已经改变
        lineData.notifyDataChanged();
        lineChart.notifyDataSetChanged();
        //设置在曲线图中显示的最大数量
        lineChart.setVisibleXRangeMaximum(10);
        //移到某个位置
        lineChart.moveViewToX(lineData.getEntryCount() - 5);
    }

    /**
     * 动态添加数据(多条折线图)
     *
     * @param numbers
     */
    public void addEntry(List numbers) {

        if (lineDataSets.get(0).getEntryCount() == 0) {
            lineData = new LineData(lineDataSets);
            lineChart.setData(lineData);
        }
        if (timeList.size() > 100) {
            timeList.clear();
        }
        timeList.add(df.format(System.currentTimeMillis()));
        for (int i = 0; i 

    

    


3. 逻辑代码

public class MainActivity extends AppCompatActivity {
    private LineChart mLineChart;

    private LineChartManager mChartManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        mChartManager = new LineChartManager(mLineChart,"sensors",Color.BLACK);
    }

    private void initView() {
        mLineChart = findViewById(R.id.line_chart);
    }

    public void addEntry(View view) {
        mChartManager.addEntry((int)(Math.random() * 100));
    }
}
饼图

1. 效果图 haha.png

2. 布局文件




    


3. 代码

public class MainActivity extends AppCompatActivity {
    private PieChart mPieChart;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initPieChart(mPieChart);
    }

    private void initPieChart(PieChart pieChart) {
        List strings = new ArrayList();
        strings.add(new PieEntry(30f,"男生"));
        strings.add(new PieEntry(70f,"女生"));
        PieDataSet dataSet = new PieDataSet(strings,"");

        ArrayList colors = new ArrayList();
        colors.add(Color.RED);
        colors.add(Color.BLUE);
        dataSet.setColors(colors);

        PieData pieData = new PieData(dataSet);
        pieData.setDrawValues(true);
        pieData.setValueFormatter(new PercentFormatter(pieChart));
        pieData.setValueTextSize(12f);
        pieData.setValueTextColor(Color.WHITE);

        Description description = new Description();
        description.setText("");
        pieChart.setDescription(description);
        pieChart.setHoleRadius(0f);
        pieChart.setTransparentCircleRadius(0f);
        pieChart.setUsePercentValues(true);

        pieChart.setData(pieData);
        pieChart.invalidate();
    }

    private void initView() {
        mPieChart = findViewById(R.id.pie_chart);
    }
}
柱状图

1. 效果图 33.png

2. 布局文件




    


3. 代码

public class MainActivity extends AppCompatActivity {
    private BarChart mBarChart;
    private List mBarEntries;
    private BarData mBarData;
    private BarDataSet mBarDataSet;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initBarEntries();
        initBarData();
    }

    private void initView() {
        mBarChart = findViewById(R.id.bar_chart);
        mBarChart.setNoDataText("正在初始化...");
    }

    private void initBarEntries() {
        BarEntry barEntry1 = new BarEntry(0f, 30f);
        BarEntry barEntry2 = new BarEntry(1f, 40f);
        BarEntry barEntry3 = new BarEntry(2f, 50f);
        BarEntry barEntry4 = new BarEntry(3f, 60f);
        BarEntry barEntry5 = new BarEntry(4f, 70f);

        mBarEntries = new ArrayList();
        mBarEntries.add(barEntry1);
        mBarEntries.add(barEntry2);
        mBarEntries.add(barEntry3);
        mBarEntries.add(barEntry4);
        mBarEntries.add(barEntry5);
    }

    private void initBarData() {
        mBarDataSet = new BarDataSet(mBarEntries,"sleep");
        mBarData = new BarData(mBarDataSet);

        // mBarDataSet.setColors(colors); 给柱状图设置颜色

        initX(mBarChart);
        initY(mBarChart);

        Description desc = new Description();
        desc.setText("");
        mBarChart.setDescription(desc);
        mBarChart.setData(mBarData);
        mBarChart.invalidate();
    }

    private void initX(BarChart barChart) {
        final String[] weeks = {"周一","周二","周三","周四","周五"};

        XAxis xAxis = barChart.getXAxis();
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setValueFormatter(new ValueFormatter() {
            @Override
            public String getFormattedValue(float value) {
                return weeks[(int)value];
            }
        });
        barChart.getLegend().setEnabled(false);
        xAxis.setLabelCount(weeks.length,false);
    }

    private void initY(BarChart barChart) {
        barChart.getAxisLeft().setDrawZeroLine(true);
        //去掉左侧Y轴刻度
        barChart.getAxisLeft().setDrawLabels(false);
        //去掉左侧Y轴
        barChart.getAxisLeft().setDrawAxisLine(false);
        //去掉中间竖线
        barChart.getXAxis().setDrawGridLines(false);
        //去掉中间横线
        barChart.getAxisLeft().setDrawGridLines(false);
    }


}

关注
打赏
1658837700
查看更多评论
立即登录/注册

微信扫码登录

0.0671s