在activity的xml中引入:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.github.mikephil.charting.charts.BarChart
android:id="@+id/chart1"
android:layout_marginLeft="18dip"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="50dp"
android:layout_marginBottom="50dp"
/>
</RelativeLayout>
我们看一下最简单的一个柱形图怎么绘制:
横坐标是从0到5，纵坐标是3000，2000，5000，1000，6000，1500
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_barchart);
setTitle("AnotherBarActivity11");
chart = (BarChart)findViewById(R.id.chart1);
chart.getDescription().setEnabled(false);
// if more than 60 entries are displayed in the chart, no values will be
// drawn
chart.setMaxVisibleValueCount(60);
// scaling can now only be done on x- and y-axis separately
chart.setPinchZoom(false);
chart.setDrawBarShadow(false);
chart.setDrawGridBackground(false);
XAxis xAxis = chart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setDrawGridLines(false);
YAxis yAxis = chart.getAxisLeft();
yAxis.setDrawGridLines(false);
yAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART); //y轴的数值显示在外侧
yAxis.setAxisMinimum(0f); ////为这个轴设置一个自定义的最小值。如果设置,这个值不会自动根据所提供的数据计算
chart.getAxisRight().setEnabled(false);
chart.getAxisLeft().setDrawGridLines(false);
// add a nice and smooth animation
//chart.animateY(1500);
initData();
chart.getLegend().setEnabled(false);
chart.setScaleYEnabled(false);
chart.setScaleXEnabled(false);
}
private void initData() {
ArrayList<BarEntry> values = new ArrayList<>();
for(int i=0;i<7;i++) {
float val = 0;
if(i == 0) {
val = 3000;
}else if(i == 1) {
val = 2000;
}else if(i == 2) {
val = 5000;
}else if(i == 3) {
val = 1000;
}else if(i == 4) {
val = 6000;
}else if(i == 5) {
val = 1500;
}
values.add(new BarEntry(i, val));
}
BarDataSet set1;
if (chart.getData() != null &&
chart.getData().getDataSetCount() > 0) {
set1 = (BarDataSet) chart.getData().getDataSetByIndex(0);
set1.setValues(values);
chart.getData().notifyDataChanged();
chart.notifyDataSetChanged();
} else {
set1 = new BarDataSet(values, "Data Set");
set1.setColors(ColorTemplate.VORDIPLOM_COLORS);
set1.setDrawValues(false);
ArrayList<IBarDataSet> dataSets = new ArrayList<>();
dataSets.add(set1);
BarData data = new BarData(dataSets);
chart.setData(data);
chart.setFitBars(true);
}
chart.invalidate();
}我们来解释关键的几句话:
yAxis.setAxisMinimum(0f); ////为这个轴设置一个自定义的最小值。如果设置,这个值不会自动根据所提供的数据计算
设置y轴从0开始
yAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART); //y轴的数值显示在外侧
y轴的数值显示在外侧
chart.getAxisRight().setEnabled(false);
图表的右侧不显示y轴
yAxis.setDrawGridLines(false);
y轴不显示网格线
chart.setScaleYEnabled(false);
chart.setScaleXEnabled(false);
图表x和y方向不能用手指放大和缩小
ArrayList<BarEntry> values = new ArrayList<>();
for(int i=0;i<7;i++) {
float val = 0;
if(i == 0) {
val = 3000;
}else if(i == 1) {
val = 2000;
}else if(i == 2) {
val = 5000;
}else if(i == 3) {
val = 1000;
}else if(i == 4) {
val = 6000;
}else if(i == 5) {
val = 1500;
}
values.add(new BarEntry(i, val));
}构造x轴和y轴的数据
如何把x轴变成自定义的标签呢:
private void initData() {
ArrayList<BarEntry> values = new ArrayList<>();
final ArrayList<String> xLabelValue = new ArrayList<>();
for(int i=0;i<7;i++) {
xLabelValue.add((i+1)+"月份");
}
for(int i=0;i<7;i++) {
float val = 0;
if(i == 0) {
val = 3000;
}else if(i == 1) {
val = 2000;
}else if(i == 2) {
val = 5000;
}else if(i == 3) {
val = 1000;
}else if(i == 4) {
val = 6000;
}else if(i == 5) {
val = 1500;
}
values.add(new BarEntry(i, val));
}
BarDataSet set1;
if (chart.getData() != null &&
chart.getData().getDataSetCount() > 0) {
set1 = (BarDataSet) chart.getData().getDataSetByIndex(0);
set1.setValues(values);
chart.getData().notifyDataChanged();
chart.notifyDataSetChanged();
} else {
set1 = new BarDataSet(values, "Data Set");
set1.setColors(ColorTemplate.VORDIPLOM_COLORS);
set1.setDrawValues(false);
ArrayList<IBarDataSet> dataSets = new ArrayList<>();
dataSets.add(set1);
xLabels.setValueFormatter(new IAxisValueFormatter() {
@Override
public String getFormattedValue(float v, AxisBase axisBase) {
return xLabelValue.get((int) v);
}
});
BarData data = new BarData(dataSets);
chart.setData(data);
chart.setFitBars(true);
}
chart.invalidate();
}如何让BarChart的圆柱体包含两部分内容呢:
private void initData() {
ArrayList<BarEntry> values = new ArrayList<>();
final ArrayList<String> xLabelValue = new ArrayList<>();
for(int i=0;i<7;i++) {
xLabelValue.add((i+1)+"月份");
}
for(int i=0;i<7;i++) {
float[] val = new float[2];
if(i == 0) {
val[1] = 2000;
val[0] = 1000;
}else if(i == 1) {
val[1] = 1500;
val[0] = 500;
}else if(i == 2) {
val[1] = 3000;
val[0] = 2000;
}else if(i == 3) {
val[1] = 700;
val[0] = 300;
}else if(i == 4) {
val[1] = 5100;
val[0] = 900;
}else if(i == 5) {
val[1] = 1300;
val[0] = 200;
}
values.add(new BarEntry(i, val));
}
BarDataSet set1;
if (chart.getData() != null &&
chart.getData().getDataSetCount() > 0) {
set1 = (BarDataSet) chart.getData().getDataSetByIndex(0);
set1.setValues(values);
chart.getData().notifyDataChanged();
chart.notifyDataSetChanged();
} else {
set1 = new BarDataSet(values, "Data Set");
set1.setColors(ColorTemplate.VORDIPLOM_COLORS);
set1.setDrawValues(false);
ArrayList<IBarDataSet> dataSets = new ArrayList<>();
dataSets.add(set1);
xLabels.setValueFormatter(new IAxisValueFormatter() {
@Override
public String getFormattedValue(float v, AxisBase axisBase) {
return xLabelValue.get((int) v);
}
});
BarData data = new BarData(dataSets);
chart.setData(data);
chart.setFitBars(true);
}
chart.invalidate();
}val[0]表示圆柱体的第一部分的数值，val[1]表示圆柱体第二部分的数值
如果想让y轴也加上自定义标签，那么
那么加上这一句:
//左侧Y轴自定义值
leftAxis.setValueFormatter(new IAxisValueFormatter() {
@Override
public String getFormattedValue(float v, AxisBase axisBase) {
return (int)v+"元";
}
});
