基于MPAndroidChart库制作K线图(二) ­­­­­­­­­­­­—— 自定义x、y轴

目录
基于MPAndroidChart库制作K线图(一) ­­­­­­­­­­­­—— 基础图
基于MPAndroidChart库制作K线图(二) ­­­­­­­­­­­­—— 自定义x、y轴
基于MPAndroidChart库制作K线图(三) ­­­­­­­­­­­­—— 手势高亮联动

一、效果图

二、针对x轴的标签进行自定义
可以看一下x轴的渲染器XAxisRenderer的源码,其中在绘制标签方法drawLabels()中可以发现所有的标签是居中显示在x轴的轴线上,而我需要的做的是将最左边的标签在屏幕靠右完整显示,最右边的标签在屏幕靠左完整显示,其余标签保持原来的不变。

继承XAxisRenderer重写drawLabels()方法

@Override
protected void drawLabels(Canvas c, float pos, MPPointF anchor) {final float labelRotationAngleDegrees = mXAxis.getLabelRotationAngle();boolean centeringEnabled = mXAxis.isCenterAxisLabelsEnabled();float[] positions = new float[mXAxis.mEntryCount * 2];for (int i = 0; i < positions.length; i += 2) {// only fill x valuesif (centeringEnabled) {positions[i] = mXAxis.mCenteredEntries[i / 2];} else {positions[i] = mXAxis.mEntries[i / 2];}}mTrans.pointValuesToPixel(positions);for (int i = 0; i < positions.length; i += 2) {float x = positions[i];if (mViewPortHandler.isInBoundsX(x)) {String label = mXAxis.getValueFormatter().getFormattedValue(mXAxis.mEntries[i / 2], mXAxis);if (mXAxis.isAvoidFirstLastClippingEnabled()) {// avoid clipping of the lastfloat width = Utils.calcTextWidth(mAxisLabelPaint, label);if (i == mXAxis.mEntryCount * 2 - 2 && mXAxis.mEntryCount > 1) {x -= width / 2 + interval;// avoid clipping of the first} else if (i == 0) {x += width / 2 + interval;}}drawLabel(c, label, x, pos, anchor, labelRotationAngleDegrees);}}
}

只修改了25行和28行 ,使第一个标签向右偏移一个距离、最后一个标签向左偏移一个距离;
然后将渲染器设置给CombinedChart

Transformer trans = ccKl.getTransformer(YAxis.AxisDependency.LEFT);
//自定义X轴标签位置
ccKl.setXAxisRenderer(new InBoundXAxisRenderer(ccKl.getViewPortHandler(), ccKl.getXAxis(), trans, 10));

然后就是设置x轴的显示的文字,通过setValueFormatter()方法可以自定义x轴显示的文字格式,如果不设置或者取不到x坐标值时不能返回null否则会空指针,返回空字符串即可。

xac.setValueFormatter(new IAxisValueFormatter() {@Overridepublic String getFormattedValue(float value, AxisBase axis) {int v = (int) value;if (!xValues.containsKey(v) && xValues.containsKey(v - 1)) {v = v - 1;}String x = xValues.get(v);return TextUtils.isEmpty(x) ? "" : x;}
});

三、针对y轴的标签进行自定义
y轴的渲染器YAxisRenderer,同理继承YAxisRenderer重写drawYLabels()方法,使y轴最上面的标签处于刻度下方,最下面的标签处于刻度上方

@Override
protected void drawYLabels(Canvas c, float fixedPosition, float[] positions, float offset) {final int from = mYAxis.isDrawBottomYLabelEntryEnabled() ? 0 : 1;final int to = mYAxis.isDrawTopYLabelEntryEnabled() ? mYAxis.mEntryCount : (mYAxis.mEntryCount - 1);int labelHeight = Utils.calcTextHeight(mAxisLabelPaint, "A");for (int i = from; i < to; i++) {String text = mYAxis.getFormattedLabel(i);float os = i == mYAxis.mEntryCount - 1 ? -0.9F * labelHeight : 0.7F * labelHeight;c.drawText(text, fixedPosition, positions[i * 2 + 1] + offset - os, mAxisLabelPaint);}
}

然后将渲染器设置给CombinedChart

//自定义Y轴标签位置
ccKl.setRendererLeftYAxis(new InBoundYAxisRenderer(ccKl.getViewPortHandler(), ccKl.getAxisLeft(), trans));

四、源码下载

github: https://github.com/xkdaq/KoinChart
coding: https://coding.net/u/xkdaq/p/KoinChart/git