1.在项目的module中的build.gradle添加如下代码:
allprojects {
repositories {
maven { url "https://jitpack.io" }
}
}
2. 在依赖中添加如下代码依赖:
dependencies {
implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
}
public static void initChart(LineChart chart, Context context){
//此属性设置之后,点击图标中的某个点网格会自动将此点移动到屏幕中心 不设置则没反应
mChart.setOnChartValueSelectedListener(this);
// no description text
// mChart.getDescription().setEnabled(false);
//设置是否绘制chart边框的线
mChart.setDrawBorders(false);
//设置chart边框线颜色
mChart.setBorderColor(Color.RED);
//设置chart边框线宽度
mChart.setBorderWidth(1f);
//设置chart是否可以触摸
mChart.setTouchEnabled(true);
mChart.setDragDecelerationFrictionCoef(0.9f);
//设置是否可以拖拽
mChart.setDragEnabled(true);
//设置是否可以缩放 x和y,默认true
mChart.setScaleEnabled(true);
//设置是否可以通过双击屏幕放大图表。默认是true
mChart.setDoubleTapToZoomEnabled(false);
//是否启用网格背景
mChart.setDrawGridBackground(false);
mChart.setHighlightPerDragEnabled(true);
//设置chart动画 x轴y轴都有动画
//mChart.animateXY(2000, 2000);
// false代表缩放时X与Y轴分开缩放,true代表同时缩放
mChart.setPinchZoom(true);
// set an alternative background color
//图表背景颜色的设置
mChart.setBackgroundColor(Color.LTGRAY);
//图表进入的动画时间
mChart.animateX(2500);
//描述信息
Description description = new Description();
description.setText("描述信息相关内容");
//设置描述信息
mChart.setDescription(description);
//设置没有数据时显示的文本
mChart.setNoDataText("没有数据撒...")
}
Legend l = mChart.getLegend();
// modify the legend ...
//表头代表线条说明前的图形 可以设置线形,圆形,方形
l.setForm(LegendForm.SQUARE);
l.setTypeface(mTfLight);
//表头字体大小
l.setTextSize(11f);
//表头线条说明的颜色
l.setTextColor(Color.RED);
//表头线条放置的位置
l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);
//表头多条线条的排列方式
l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
//表头的说明是否绘制到图表内部
l.setDrawInside(false);
xAxis = mChart.getXAxis();
xAxis.setTypeface(mTfLight);
xAxis.setTextSize(8f);
//X轴显示的位置
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE);
//X轴
xAxis.setSpaceMin(0.5f);
//X轴数据的颜色
xAxis.setTextColor(Color.BLUE);
//是否绘制X轴的网格线
xAxis.setDrawGridLines(false);
xAxis.setDrawAxisLine(false);
//TODO 设置x轴坐标显示的数量 加true才能显示设置的数量 一旦加true后续的x轴数据显示有问题,
// xAxis.setLabelCount(5,true);
xAxis.setLabelCount(5);
//设置竖线为虚线样子
xAxis.enableGridDashedLine(10f, 10f, 0f);
//图表第一个和最后一个label数据不超出左边和右边的Y轴
// xAxis.setAvoidFirstLastClipping(true);
/********************************************************************************/
final Map xMap = new HashMap<>();
final String[] valueArry = {"2017-05-11", "2017-05-12", "2017-05-13", "2017-05-14", "2017-05-15","2017-05-16", "2017-05-17", "2017-35-18", "2017-05-19", "2017-05-20","2017-05-21", "2017-05-22", "2017-05-23", "2017-05-24", "2017-05-25","2017-05-26", "2017-05-27", "2017-05-28", "2017-05-29", "2017-05-30"};
for (int i = 0; i < yVals1.size(); i++) {
xMap.put((int) yVals1.get(i).getX(), valueArry[i]);
}
//自定义x轴标签数据
xAxis.setValueFormatter(new IAxisValueFormatter() {
@Override
public String getFormattedValue(float value, AxisBase axis) {
return xMap.get((int)value);
}
});
/********************************************************************************/
//设置限制线 70代表某个该轴某个值,也就是要画到该轴某个值上
LimitLine limitLine = new LimitLine(70);
//设置限制线的宽
limitLine.setLineWidth(1f);
//设置限制线的颜色
limitLine.setLineColor(Color.RED);
//设置基线的位置
limitLine.setLabelPosition(LimitLine.LimitLabelPosition.LEFT_TOP);
limitLine.setLabel("我是基线,也可以叫我水位线");
//设置限制线为虚线
limitLine.enableDashedLine(10f, 10f, 0f);
//左侧Y轴属性设置
YAxis leftAxis = mChart.getAxisLeft();
leftAxis.setTypeface(mTfLight);
//Y轴数据的字体颜色
leftAxis.setTextColor(ColorTemplate.getHoloBlue());
//左侧Y轴最大值
leftAxis.setAxisMaximum(200f);
//左侧Y轴最小值
leftAxis.setAxisMinimum(0f);
//是否绘制Y轴网格线
leftAxis.setDrawGridLines(false);
//TODO 什么属性?
leftAxis.setGranularityEnabled(true);
//左边Y轴添加限制线
leftAxis.addLimitLine(limitLine);
//右侧Y轴坐标
YAxis rightAxis = mChart.getAxisRight();
rightAxis.setTypeface(mTfLight);
rightAxis.setTextColor(Color.WHITE);
rightAxis.setAxisMaximum(900);
rightAxis.setAxisMinimum(0);
rightAxis.setDrawGridLines(false);
//是否绘制等0线
rightAxis.setDrawZeroLine(true);
rightAxis.setGranularityEnabled(false);
LineDataSet dataSet = new LineDataSet(entries, label);
// 设置曲线的颜色
dataSet.setColor(lineColor);
//数值文字颜色
dataSet.setValueTextColor(textColor);
// 模式为贝塞尔曲线
dataSet.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER);
// 是否绘制数据值
dataSet.setDrawValues(false);
// 是否绘制圆点
dataSet.setDrawCircles(false);
dataSet.setDrawCircleHole(false);
// 这里有一个坑,当我们想隐藏掉高亮线的时候,MarkerView 跟着不见了
// 因此只有将它设置成透明色
// dataSet.setHighlightEnabled(true);// 隐藏点击时候的高亮线
//设置高亮线为透明色
// dataSet.setHighLightColor(Color.TRANSPARENT);
//设置圆点的颜色
dataSet.setCircleColor(lineColor);
// 设置圆点半径
dataSet.setCircleRadius(1f);
// 设置线的宽度
dataSet.setLineWidth(3f);
//设置线的容器
ArrayList sets = new ArrayList<>();
sets.clear();
//多个dataset就是多条线
sets.add(dataSet);
XAxis xAxis = chart.getXAxis();
//设置x轴偏移量,有时显示年月日时X轴数据显示不全时,需要给与一定的偏移量,来让数据显示全
chart.setExtraRightOffset(30f);
chart.setExtraLeftOffset(10f);
//这里list是string的日期集合,用来在X轴显示日期
xAxis.setValueFormatter(new IndexAxisValueFormatter(list));
YAxis yAxis = chart.getAxisLeft();
//这里是为了让Y轴显示负值,默认Y轴从0开始
yAxis.resetAxisMinimum();
LineData d = new LineData(sets);
chart.setData(d);
chart.invalidate();
表头有时显示多个标签,需要有换行,以及表头图形和文字间隔的设置
Legend l = mChart.getLegend();
//表头代表线条说明前的图形 可以设置线形,圆形,方形
l.setForm(Legend.LegendForm.SQUARE);
//设置图形与文本的间隔(单位:dp),默认5dp
l.setFormToTextSpace(3f);
//表头线条放置的位置
l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
//表头多条线条的排列方式
l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
//表头的说明是否绘制到图表内部
l.setDrawInside(false);
//自动换行
l.setWordWrapEnabled(true);
//表头间距
l.setXEntrySpace(5f);
//表头行间距
l.setYEntrySpace(5f);
Y轴有时需要自定义样式,例如0.23%等样式
yAxis.setValueFormatter(new ValueFormatter() {
@Override
public String getFormattedValue(float value) {
return String.format("%.2f", value * 100) + "%";
}
});
样式还原使用
yAxis.setValueFormatter(null);
动态显示多条数据时,设置数据不显示使用
lineChart.notifyDataSetChanged();
最后放一下效果图