MPchart使用详解及详细属性(一)

版权声明:转载请标明出处 http://blog.csdn.net/github_33304260 https://blog.csdn.net/github_33304260/article/details/51272078

项目源代码:https://github.com/libin7278/MpChart

#第一步 添加依赖或导入Library

    dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:23.2.0'
    compile 'com.github.PhilJay:MPAndroidChart:v2.2.3'
}

github:https://github.com/PhilJay/MPAndroidChart
#第二步 布局文件

 <?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">

    <TextView
        android:textSize="30sp"
        android:textColor="#ff00ff"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MPchartDemo"/>


    <com.github.mikephil.charting.charts.BarChart
        android:id="@+id/day_fragment_bar_chart"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/seekBar1" />
</LinearLayout>

#第三步 MainActivity代码

package com.tunshu.mydemo;

import android.app.Activity;
import android.os.Bundle;

import com.github.mikephil.charting.charts.BarChart;
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;


public class MainActivity extends Activity {
    private BarChart day_fragment_bar_chart;
    private BarData mBarData;

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

        day_fragment_bar_chart= (BarChart) findViewById(R.id.day_fragment_bar_chart);

		//getBarData(X轴坐标个数, X所对应的值也就是Y值)
        mBarData = getBarData(24, 10);
        showBarChart(day_fragment_bar_chart, mBarData);

    }

	/**
	 *用来处理视图的方法
	 */
    private void showBarChart(BarChart barChart, BarData barData) {

    }

	/**
	 *用来处理数据的方法
	 */
    private BarData getBarData(int count, float range) {
        ArrayList<String> xValues = new ArrayList<String>();
        for (int i = 0; i < count; i++) {
            xValues.add(i + "");
        }

        ArrayList<BarEntry> yValues = new ArrayList<BarEntry>();

        for (int i = 0; i < count; i++) {
            float value = (float) (Math.random() * range/*100以内的随机数*/) + 3;
            yValues.add(new BarEntry(value, i));
        }

        // y轴的数据集合
        BarDataSet barDataSet = new BarDataSet(yValues, "collection");

        ArrayList<BarDataSet> barDataSets = new ArrayList<BarDataSet>();
        barDataSets.add(barDataSet); // add the datasets

        BarData barData = new BarData(xValues, barDataSet);

        return barData;
    }
}

在MainActivity中已经封装好了处理数据和视图的方法;
这里写图片描述

#第四步 详细属性介绍

private void showBarChart(BarChart barChart, BarData barData) {
        // 如果没有数据的时候,会显示这个,类似ListView的EmptyView
        barChart.setNoDataTextDescription("You need to provide data for the chart.");
    }

这里写图片描述

private void showBarChart(BarChart barChart, BarData barData) {
        barChart.setData(barData); // 设置数据
    }

这里写图片描述

barChart.setDrawBorders(true); //是否在折线图上添加边框

这里写图片描述

barChart.setDescription("数据描述");// 数据描述
barChart.setDescriptionPosition(100,20);//数据描述的位置
barChart.setDescriptionColor(Color.GRAY);//数据的颜色
barChart.setDescriptionTextSize(40);//数据字体大小

如果此处不想要描述必须要设置 barChart.setDescription("");不然会显示默认的 Description。
这里写图片描述

barChart.setDrawGridBackground(true); // 是否显示表格颜色
barChart.setGridBackgroundColor(Color.RED); // 表格的的颜色

这里写图片描述

barChart.setTouchEnabled(false); // 设置是否可以触摸
barChart.setDragEnabled(false);// 是否可以拖拽
barChart.setScaleEnabled(false);// 是否可以缩放
barChart.setPinchZoom(false);//y轴的值是否跟随图表变换缩放;如果禁止,y轴的值会跟随图表变换缩放
barChart.setBackgroundColor(Color.BLACK);// 设置整个图表控件的背景

这里写图片描述

 barChart.setDrawBarShadow(true);//柱状图没有数据的部分是否显示阴影效果

这里写图片描述

barChart.setDrawValueAboveBar(false);//柱状图上面的数值是否在柱子上面

这里写图片描述

//是否显示竖直标尺线
barChart.getXAxis().setDrawGridLines(false);

这里写图片描述
这里写图片描述

//设置横坐标显示的间隔数
barChart.getXAxis().setLabelsToSkip(4);

这里写图片描述

//设置横坐标倾斜角度
barChart.getXAxis().setLabelRotationAngle(20);

这里写图片描述

//设置横坐标之间的间隔距离 float值 
//不能与setLabelsToSkip()一起使用否则失效
barChart.getXAxis().setSpaceBetweenLabels(50);

这里写图片描述

//是否显示X轴数值
//默认是true
barChart.getXAxis().setDrawLabels(false);

这里写图片描述

//右侧是否显示Y轴数值
barChart.getAxisRight().setDrawLabels(false);

这里写图片描述

//是否显示最右侧竖线
barChart.getAxisRight().setEnabled(false);

这里写图片描述

//自定义Y轴文字样式
YAxisValueFormatter custom = new MyYAxisValueFormatter();
baChart.getAxisLeft().setValueFormatter(custom);
 public class MyYAxisValueFormatter implements YAxisValueFormatter {

        private DecimalFormat mFormat;

        public MyYAxisValueFormatter() {
            mFormat = new DecimalFormat("###,###,###,##0");
        }

        @Override
        public String getFormattedValue(float value, YAxis yAxis) {
            return mFormat.format(value) + "K";
        }
    }

这里写图片描述

//设置比例图标的位置  barChart.getLegend().setPosition(Legend.LegendPosition.RIGHT_OF_CHART);
//设置比例图标和文字之间的位置方向barChart.getLegend().setDirection(Legend.LegendDirection.RIGHT_TO_LEFT);
barChart.getLegend().setTextColor(Color.RED);

这里写图片描述

//设置动画
barChart.animateXY(2000,3000);
// y轴的数据集合
BarDataSet barDataSet = new BarDataSet(yValues, "collection");
        
barDataSet.setBarSpacePercent(80);
barDataSet.setVisible(true);//是否显示柱状图柱子
barDataSet.setColor(Color.RED);//设置柱子颜色
barDataSet.setDrawValues(false);//是否显示柱子上面的数值
package com.tunshu.mydemo;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;

import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.components.Legend;
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 com.github.mikephil.charting.formatter.YAxisValueFormatter;

import java.text.DecimalFormat;
import java.util.ArrayList;


public class MainActivity extends Activity {
    private BarChart day_fragment_bar_chart;
    private BarData mBarData;

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

        day_fragment_bar_chart= (BarChart) findViewById(R.id.day_fragment_bar_chart);

        mBarData = getBarData(24, 10);
        showBarChart(day_fragment_bar_chart, mBarData);

    }

    private void showBarChart(BarChart barChart, BarData barData) {
        // 如果没有数据的时候,会显示这个,类似ListView的EmptyView
        barChart.setNoDataTextDescription("You need to provide data for the chart.");

        barChart.setData(barData); // 设置数据

        barChart.setDrawBorders(false); //是否在折线图上添加边框

        barChart.setDescription("数据描述");// 数据描述
        barChart.setDescriptionPosition(100,20);//数据描述的位置
        barChart.setDescriptionColor(Color.RED);//数据的颜色
        barChart.setDescriptionTextSize(40);//数据字体大小

        barChart.setDrawGridBackground(false); // 是否显示表格颜色
        barChart.setGridBackgroundColor(Color.RED); // 表格的的颜色
        //barChart.setBackgroundColor(Color.BLACK);// 设置整个图标控件的背景
        barChart.setDrawBarShadow(false);//柱状图没有数据的部分是否显示阴影效果

        barChart.setTouchEnabled(false); // 设置是否可以触摸
        barChart.setDragEnabled(false);// 是否可以拖拽
        barChart.setScaleEnabled(false);// 是否可以缩放
        barChart.setPinchZoom(false);//y轴的值是否跟随图表变换缩放;如果禁止,y轴的值会跟随图表变换缩放

        barChart.setDrawValueAboveBar(true);//柱状图上面的数值显示在柱子上面还是柱子里面

        barChart.getXAxis().setDrawGridLines(false);//是否显示竖直标尺线
        barChart.getXAxis().setLabelsToSkip(11);//设置横坐标显示的间隔
//        barChart.getXAxis().setLabelRotationAngle(20);//设置横坐标倾斜角度
//        barChart.getXAxis().setSpaceBetweenLabels(50);
        barChart.getXAxis().setDrawLabels(true);//是否显示X轴数值
        barChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);//设置X轴的位置 默认在上方

        barChart.getAxisRight().setDrawLabels(false);//右侧是否显示Y轴数值
        barChart.getAxisRight().setEnabled(false);//是否显示最右侧竖线
        barChart.getAxisRight().setDrawAxisLine(true);
        barChart.getAxisLeft().setDrawAxisLine(false);
        barChart.getXAxis().setDrawAxisLine(true);


        YAxisValueFormatter custom = new MyYAxisValueFormatter();//自定义Y轴文字样式
        barChart.getAxisLeft().setValueFormatter(custom);

        barChart.getLegend().setPosition(Legend.LegendPosition.RIGHT_OF_CHART);//设置比例图标的位置
        barChart.getLegend().setDirection(Legend.LegendDirection.RIGHT_TO_LEFT);//设置比例图标和文字之间的位置方向
        barChart.getLegend().setTextColor(Color.RED);

        barChart.animateXY(2000,3000);
    }

    private BarData getBarData(int count, float range) {
        ArrayList<String> xValues = new ArrayList<String>();
        for (int i = 0; i < count; i++) {
            xValues.add(i + "");
        }

        ArrayList<BarEntry> yValues = new ArrayList<BarEntry>();

        for (int i = 0; i < count; i++) {
            float value = (float) (Math.random() * range/*100以内的随机数*/) + 3;
            yValues.add(new BarEntry(value, i));
        }

        // y轴的数据集合
        BarDataSet barDataSet = new BarDataSet(yValues, "collection");

        barDataSet.setBarSpacePercent(80);
        barDataSet.setVisible(true);//是否显示柱状图柱子
        barDataSet.setColor(Color.RED);//设置柱子颜色
        barDataSet.setDrawValues(false);//是否显示柱子上面的数值

        ArrayList<BarDataSet> barDataSets = new ArrayList<BarDataSet>();
        barDataSets.add(barDataSet); // add the datasets

        BarData barData = new BarData(xValues, barDataSet);

        return barData;
    }

    public class MyYAxisValueFormatter implements YAxisValueFormatter {

        private DecimalFormat mFormat;

        public MyYAxisValueFormatter() {
            mFormat = new DecimalFormat("###,###,###,##0");
        }

        @Override
        public String getFormattedValue(float value, YAxis yAxis) {
            return mFormat.format(value) + "K";
        }
    }
}

这里写图片描述

//设置Y轴显示数量
barChart.getAxisLeft().setLabelCount(2,false);

~~号外~~福利~~号外~~
程序员的福音: “老曾筋骨祛痛贴”,百年祖传配方,专治腰间盘肩周颈椎坐骨神经腰腿疼痛等,博主亲测效果非常棒,因长期久坐写代码,坐姿不规范导致脖子疼,腰椎疼,用过之后疼痛逐渐缓解,现在已无任何疼痛,用过后让你写代码一身轻松,so easy,妈妈再也不用担心我们写代码了。
购买链接: https://k.weidian.com/tja7GYzB

扫码下方二维码,关注公众号“伟大程序猿的诞生“,回复“膏药”领取优惠券
扫码关注公众号“伟大程序猿的诞生“,更多干货新鲜文章等着你~

公众号回复“资料获取”,获取更多干货哦~
公众号回复“膏药”,领取优惠券哦~

有问题添加本人微信号“fenghuokeji996” 或扫描博客导航栏本人二维码

展开阅读全文

没有更多推荐了,返回首页