首先从作者那里下载 MpAndroidChart.jar : https://github.com/PhilJay/MPAndroidChart
怎么导入项目我就不罗嗦了 ,来不及解释了,看图看代码
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.data.BarData;
import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
public class MainActivity extends Activity {
private BarChart mBarChart,mBarChart2,mBarChart3,mBarChart4,mBarChart5,mBarChart6,mBarChart7,mBarChart8,mBarChart9;
private BarData mBarData;
private BarCharts mBarCharts;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
mBarCharts = new BarCharts();
// 创建多张图表
mBarChart = (BarChart) findViewById(R.id.spreadBarChart);
mBarChart2 = (BarChart) findViewById(R.id.spreadBarChart2);
mBarChart3 = (BarChart) findViewById(R.id.spreadBarChart3);
mBarChart4 = (BarChart) findViewById(R.id.spreadBarChart4);
mBarChart5 = (BarChart) findViewById(R.id.spreadBarChart5);
mBarChart6 = (BarChart) findViewById(R.id.spreadBarChart6);
mBarChart7 = (BarChart) findViewById(R.id.spreadBarChart7);
mBarChart8 = (BarChart) findViewById(R.id.spreadBarChart8);
mBarChart9 = (BarChart) findViewById(R.id.spreadBarChart9);
mBarData = mBarCharts.getBarData(14, 500);
mBarCharts.showBarChart(mBarChart, mBarData);
mBarData = mBarCharts.getBarData(14, 900);
mBarCharts.showBarChart(mBarChart2, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart3, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart4, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart5, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart6, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart7, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart8, mBarData);
mBarData = mBarCharts.getBarData(14, 100);
mBarCharts.showBarChart(mBarChart9, mBarData);
}
}
然后再设置图表属性:
package com.mpadnroidchart.barchartdemo;
import java.util.ArrayList;
import android.graphics.Color;
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.Legend.LegendForm;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.XAxis.XAxisPosition;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;
/**
* @author 正月 | ZhouDaDo
*/
public class BarCharts {
private String[] color = {"#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD"};
public void showBarChart(BarChart barChart, BarData barData) {
// 数据描述
barChart.setDescription("");
// 如果没有数据的时候,会显示这个,类似ListView的EmptyView
barChart.setNoDataTextDescription("You need to provide data for the chart.");
// 是否显示表格颜色
barChart.setDrawGridBackground(false);
// 设置是否可以触摸
barChart.setTouchEnabled(true);
// 是否可以拖拽
barChart.setDragEnabled(false);
// 是否可以缩放
barChart.setScaleEnabled(false);
// 集双指缩放
barChart.setPinchZoom(false);
// 设置背景
barChart.setBackgroundColor(Color.parseColor("#01000000"));
// 如果打开,背景矩形将出现在已经画好的绘图区域的后边。
barChart.setDrawGridBackground(false);
// 集拉杆阴影
barChart.setDrawBarShadow(false);
// 图例
barChart.getLegend().setEnabled(false);
// 设置数据
barChart.setData(barData);
// 隐藏右边的坐标轴 (就是右边的0 - 100 - 200 - 300 ... 和图表中横线)
barChart.getAxisRight().setEnabled(false);
// 隐藏左边的左边轴 (同上)
// barChart.getAxisLeft().setEnabled(false);
// 网格背景颜色
barChart.setGridBackgroundColor(Color.parseColor("#00000000"));
// 是否显示表格颜色
barChart.setDrawGridBackground(false);
// 设置边框颜色
barChart.setBorderColor(Color.parseColor("#00000000"));
// 说明颜色
barChart.setDescriptionColor(Color.parseColor("#00000000"));
// 拉杆阴影
barChart.setDrawBarShadow(false);
// 打开或关闭绘制的图表边框。(环绕图表的线)
barChart.setDrawBorders(false);
Legend mLegend = barChart.getLegend(); // 设置比例图标示
// 设置窗体样式
mLegend.setForm(LegendForm.CIRCLE);
// 字体
mLegend.setFormSize(4f);
// 字体颜色
mLegend.setTextColor(Color.parseColor("#00000000"));
XAxis xAxis = barChart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setDrawGridLines(false);
xAxis.setSpaceBetweenLabels(2);
barChart.animateY(1000); // 立即执行的动画,Y轴
}
public BarData getBarData(int count, float range) {
ArrayList<String> xValues = new ArrayList<String>();
for (int i = 0; i < count; i++) {
xValues.add(""+(i+1)+"周");// 设置每个壮图的文字描述
}
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, "测试饼状图");
ArrayList<Integer> colors = new ArrayList<Integer>();
for(int i = 0;i < count ;i++){
colors.add(Color.parseColor(color[i]));
}
barDataSet.setColors(colors);
// 设置栏阴影颜色
barDataSet.setBarShadowColor(Color.parseColor("#01000000"));
ArrayList<BarDataSet> barDataSets = new ArrayList<BarDataSet>();
barDataSets.add(barDataSet);
barDataSet.setValueTextColor(Color.parseColor("#FF8F9D"));
// 绘制值
barDataSet.setDrawValues(true);
BarData barData = new BarData(xValues, barDataSets);
return barData;
}
}
点击下载柱状图Demo
有的小伙伴觉得柱状图不过瘾,需要多个柱状图在一起来表示一种信息 : 像这样的
来不及解释了,上代码 。
package com.barchart.barchart3sdemo;
import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.data.BarData;
public class MainActivity extends Activity {
private BarChart3s mBarChart3s;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
BarChart chart = (BarChart) findViewById(R.id.chart);
mBarChart3s = new BarChart3s(chart);
BarData data = new BarData(mBarChart3s.getXAxisValues(), mBarChart3s.getDataSet());
// 设置数据
chart.setData(data);
}
}
package com.barchart.barchart3sdemo;
import java.util.ArrayList;
import android.graphics.Color;
import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.Legend.LegendForm;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.XAxis.XAxisPosition;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;
public class BarChart3s {
public BarChart3s(BarChart chart) {
// 数据描述
chart.setDescription("");
// 动画
chart.animateY(1000);
// 设置是否可以触摸
chart.setTouchEnabled(true);
// 是否可以拖拽
chart.setDragEnabled(false);
// 是否可以缩放
chart.setScaleEnabled(false);
// 集双指缩放
chart.setPinchZoom(false);
// 隐藏右边的坐标轴
chart.getAxisRight().setEnabled(false);
// 隐藏左边的左边轴
chart.getAxisLeft().setEnabled(false);
Legend mLegend = chart.getLegend(); // 设置比例图标示
// 设置窗体样式
mLegend.setForm(LegendForm.SQUARE);
// 字体
mLegend.setFormSize(4f);
// 字体颜色
mLegend.setTextColor(Color.parseColor("#7e7e7e"));
XAxis xAxis = chart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setDrawGridLines(false);
xAxis.setSpaceBetweenLabels(2);
chart.invalidate();
}
public ArrayList<BarDataSet> getDataSet() {
ArrayList<BarDataSet> dataSets = null;
ArrayList<BarEntry> valueSet1 = new ArrayList<BarEntry>();
BarEntry v1e1 = new BarEntry(110.000f, 0); // Jan
valueSet1.add(v1e1);
BarEntry v1e2 = new BarEntry(40.000f, 1); // Feb
valueSet1.add(v1e2);
BarEntry v1e3 = new BarEntry(60.000f, 2); // Mar
valueSet1.add(v1e3);
BarEntry v1e4 = new BarEntry(30.000f, 3); // Apr
valueSet1.add(v1e4);
BarEntry v1e5 = new BarEntry(90.000f, 4); // May
valueSet1.add(v1e5);
BarEntry v1e6 = new BarEntry(100.000f, 5); // Jun
valueSet1.add(v1e6);
ArrayList<BarEntry> valueSet2 = new ArrayList<BarEntry>();
BarEntry v2e1 = new BarEntry(150.000f, 0); // Jan
valueSet2.add(v2e1);
BarEntry v2e2 = new BarEntry(90.000f, 1); // Feb
valueSet2.add(v2e2);
BarEntry v2e3 = new BarEntry(120.000f, 2); // Mar
valueSet2.add(v2e3);
BarEntry v2e4 = new BarEntry(60.000f, 3); // Apr
valueSet2.add(v2e4);
BarEntry v2e5 = new BarEntry(20.000f, 4); // May
valueSet2.add(v2e5);
BarEntry v2e6 = new BarEntry(80.000f, 5); // Jun
valueSet2.add(v2e6);
ArrayList<BarEntry> valueSet3 = new ArrayList<BarEntry>();
BarEntry v3e1 = new BarEntry(20.000f, 0); // Jan
valueSet3.add(v3e1);
BarEntry v3e2 = new BarEntry(60.000f, 1); // Feb
valueSet3.add(v3e2);
BarEntry v3e3 = new BarEntry(90.000f, 2); // Mar
valueSet3.add(v3e3);
BarEntry v3e4 = new BarEntry(150.000f, 3); // Apr
valueSet3.add(v3e4);
BarEntry v3e5 = new BarEntry(120.000f, 4); // May
valueSet3.add(v3e5);
BarEntry v3e6 = new BarEntry(40.000f, 5); // Jun
valueSet3.add(v3e6);
BarDataSet barDataSet1 = new BarDataSet(valueSet1, "数据1注解");
barDataSet1.setColor(Color.parseColor("#F26077"));
barDataSet1.setBarShadowColor(Color.parseColor("#01000000"));
BarDataSet barDataSet2 = new BarDataSet(valueSet2, "数据2注解");
barDataSet2.setColor(Color.parseColor("#00C0BF"));
barDataSet2.setBarShadowColor(Color.parseColor("#01000000"));
BarDataSet barDataSet3 = new BarDataSet(valueSet3, "数据3注解");
barDataSet3.setColor(Color.parseColor("#DEAD26"));
barDataSet3.setBarShadowColor(Color.parseColor("#01000000"));
dataSets = new ArrayList<BarDataSet>();
dataSets.add(barDataSet1);
dataSets.add(barDataSet2);
dataSets.add(barDataSet3);
return dataSets;
}
public ArrayList<String> getXAxisValues() {
ArrayList<String> xAxis = new ArrayList<String>();
xAxis.add("星期一");
xAxis.add("星期二");
xAxis.add("星期三");
xAxis.add("星期四");
xAxis.add("星期五");
xAxis.add("星期六");
return xAxis;
}
}
点击下载BarChart3sDemo
但是我们有时需求希望可以在柱状图上再来个折线图。或者来一条线代表柱状图的平均值。 像这样
来不及解释了,看代码:
package com.mpchart.barchartcombined;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import android.graphics.Color;
import com.github.mikephil.charting.charts.CombinedChart;
import com.github.mikephil.charting.charts.CombinedChart.DrawOrder;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.Legend.LegendForm;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.XAxis.XAxisPosition;
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.data.BubbleData;
import com.github.mikephil.charting.data.BubbleDataSet;
import com.github.mikephil.charting.data.BubbleEntry;
import com.github.mikephil.charting.data.CandleData;
import com.github.mikephil.charting.data.CandleDataSet;
import com.github.mikephil.charting.data.CandleEntry;
import com.github.mikephil.charting.data.CombinedData;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.data.ScatterData;
import com.github.mikephil.charting.data.ScatterDataSet;
import com.github.mikephil.charting.utils.ColorTemplate;
public class BarChartCombined {
private final int itemcount = 12;
protected String[] mMonths = new String[] {"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"};
protected String[] colors = {"#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD"};
// 设置图表样式
public BarChartCombined(CombinedChart mChart) {
mChart.setDescription("");
mChart.setDrawGridBackground(false);
mChart.setDrawBarShadow(false);
// 设置是否可以触摸
mChart.setTouchEnabled(true);
// 是否可以拖拽
mChart.setDragEnabled(false);
// 是否可以缩放
mChart.setScaleEnabled(false);
// 集双指缩放
mChart.setPinchZoom(false);
// 下面的图例图例
mChart.getLegend().setEnabled(false);
// 设置背景透明
mChart.setBackgroundColor(Color.parseColor("#00000000"));
// draw bars behind lines
mChart.setDrawOrder(new DrawOrder[] {DrawOrder.BAR, DrawOrder.BUBBLE, DrawOrder.CANDLE, DrawOrder.LINE, DrawOrder.SCATTER});
// 下面标记解释设置
Legend mLegend = mChart.getLegend(); // 设置比例图标示
// 设置窗体样式
mLegend.setForm(LegendForm.CIRCLE);
// 字体
mLegend.setFormSize(4f);
// 字体颜色
mLegend.setTextColor(Color.parseColor("#000000"));
/*YAxis rightAxis = mChart.getAxisRight();
rightAxis.setDrawGridLines(false);*/
/*YAxis leftAxis = mChart.getAxisLeft();
leftAxis.setDrawGridLines(false);*/
XAxis xAxis = mChart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setDrawGridLines(false);
xAxis.setSpaceBetweenLabels(2);
CombinedData data = new CombinedData(mMonths);
data.setData(generateLineData());
data.setData(generateBarData());
// data.setData(generateBubbleData());
// data.setData(generateScatterData());
// data.setData(generateCandleData());
// 隐藏右边的坐标轴
mChart.getAxisRight().setEnabled(false);
// 隐藏左边的左边轴
mChart.getAxisLeft().setEnabled(false);
mChart.setData(data);
// 立即执行的动画,Y轴
mChart.animateY(1000);
// 刷新图表
// mChart.invalidate();
}
// 柱状图上面的折线图
public LineData generateLineData() {
LineData d = new LineData();
ArrayList<Entry> entries1 = new ArrayList<Entry>();
for (int index = 0; index < itemcount; index++)
entries1.add(new Entry(45, index));
LineDataSet set1 = new LineDataSet(entries1, "50对比线");
// 设置颜色
set1.setColor(Color.parseColor("#00A918"));
// 线宽
set1.setLineWidth(1.0f);
// 圈颜色
set1.setCircleColor(Color.parseColor("#00A918"));
// 圆的大小
set1.setCircleSize(0f);
// 填充颜色
set1.setFillColor(Color.parseColor("#00A918"));
// 绘制立方
set1.setDrawCubic(true);
// 绘制数据
set1.setDrawValues(true);
// 字体大小
set1.setValueTextSize(10f);
// 字体颜色
set1.setValueTextColor(Color.parseColor("#00000000"));
// 轴依赖
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
ArrayList<Entry> entries2 = new ArrayList<Entry>();
for (int index = 0; index < itemcount; index++)
entries2.add(new Entry(30, index));
LineDataSet set2 = new LineDataSet(entries2, "50对比线");
// 设置颜色
set2.setColor(Color.parseColor("#A12200"));
// 线宽
set2.setLineWidth(1.0f);
// 圈颜色
set2.setCircleColor(Color.parseColor("#A12200"));
// 圆的大小
set2.setCircleSize(0f);
// 填充颜色
set2.setFillColor(Color.parseColor("#A12200"));
// 绘制立方
set2.setDrawCubic(true);
// 绘制数据
set2.setDrawValues(true);
// 字体大小
set2.setValueTextSize(10f);
// 字体颜色
set2.setValueTextColor(Color.parseColor("#00000000"));
// 轴依赖
set2.setAxisDependency(YAxis.AxisDependency.LEFT);
d.addDataSet(set1);
d.addDataSet(set2);
return d;
}
public BarData generateBarData() {
BarData d = new BarData();
ArrayList<BarEntry> entries = new ArrayList<BarEntry>();
for (int index = 0; index < itemcount; index++)
entries.add(new BarEntry(getRandom(100, 3), index));
BarDataSet set = new BarDataSet(entries, "Bar DataSet");
// 设置颜色
List<Integer> colorlist = new ArrayList<Integer>();
for(int i=0;i < itemcount;i++){
colorlist.add(Color.parseColor(colors[i]));
}
set.setColors(colorlist);
// 字体颜色
set.setValueTextColor(Color.parseColor("#FF8F9D"));
// 字体大小
set.setValueTextSize(10f);
d.addDataSet(set);
set.setAxisDependency(YAxis.AxisDependency.LEFT);
return d;
}
public ScatterData generateScatterData() {
ScatterData d = new ScatterData();
ArrayList<Entry> entries = new ArrayList<Entry>();
for (int index = 0; index < itemcount; index++)
entries.add(new Entry(getRandom(20, 15), index));
ScatterDataSet set = new ScatterDataSet(entries, "Scatter DataSet");
set.setColor(Color.GREEN);
set.setScatterShapeSize(7.5f);
set.setDrawValues(false);
set.setValueTextSize(10f);
d.addDataSet(set);
return d;
}
public CandleData generateCandleData() {
CandleData d = new CandleData();
ArrayList<CandleEntry> entries = new ArrayList<CandleEntry>();
for (int index = 0; index < itemcount; index++)
entries.add(new CandleEntry(index, 20f, 10f, 13f, 17f));
CandleDataSet set = new CandleDataSet(entries, "Candle DataSet");
set.setColor(Color.rgb(80, 80, 80));
set.setBodySpace(0.3f);
set.setValueTextSize(10f);
set.setDrawValues(false);
d.addDataSet(set);
return d;
}
public BubbleData generateBubbleData() {
BubbleData bd = new BubbleData();
ArrayList<BubbleEntry> entries = new ArrayList<BubbleEntry>();
for (int index = 0; index < itemcount; index++) {
float rnd = getRandom(20, 30);
entries.add(new BubbleEntry(index, rnd, rnd));
}
BubbleDataSet set = new BubbleDataSet(entries, "Bubble DataSet");
set.setColors(ColorTemplate.VORDIPLOM_COLORS);
set.setValueTextSize(10f);
set.setValueTextColor(Color.WHITE);
set.setHighlightCircleWidth(1.5f);
set.setDrawValues(true);
bd.addDataSet(set);
return bd;
}
private float getRandom(float range, float startsfrom) {
return (float) (Math.random() * range) + startsfrom;
}
}