In MPAndroidChart Library, How to wrap X Axis Labe

2019-01-18 05:18发布

问题:

I am trying to show X axis label to go to 2 lines when they are long. How to achieve this in LineChart? See screenshot below. I want time to go to second line instead of staying next to date

回答1:

For those like me who want to achieve this but keep the original library, here is a simple solution inspired by @fgueli's modifications. This applies for one break line only (add "\n" in your labels) but you can easily adapt it to your needs.

  1. Subclass XAxisRenderer

    public class CustomXAxisRenderer extends XAxisRenderer {
        public CustomXAxisRenderer(ViewPortHandler viewPortHandler, XAxis xAxis, Transformer trans) {
             super(viewPortHandler, xAxis, trans);
        }
    
        @Override
        protected void drawLabel(Canvas c, String formattedLabel, float x, float y, MPPointF anchor, float angleDegrees) {
            String line[] = formattedLabel.split("\n");
            Utils.drawXAxisValue(c, line[0], x, y, mAxisLabelPaint, anchor, angleDegrees);
            Utils.drawXAxisValue(c, line[1], x + mAxisLabelPaint.getTextSize(), y + mAxisLabelPaint.getTextSize(), mAxisLabelPaint, anchor, angleDegrees);
        }
    }
    

  1. Set this renderer on the desired chart

    lineChart.setXAxisRenderer(new CustomXAxisRenderer(lineChart.getViewPortHandler(), lineChart.getXAxis(), lineChart.getTransformer(YAxis.AxisDependency.LEFT)));
    

  1. Enjoy!



回答2:

I modified the library to allow multiline label on the xAxis using \n

https://github.com/fabriziogueli/MPAndroidChart/tree/axis_multiline_labels

It is working right now but need further testing and maybe some code styling / adjustment.

XAxis xAxis = mChart.getXAxis();
xAxis.setMultiLineLabel(true);

Then you can use for example a SimpleDateFormat like this:

SimpleDateFormat sdf = new SimpleDateFormat("dd/MM/yy\nHH:mm a");

Maybe you have to set extra bottom offset to your chart:

mChart.setExtraBottomOffset(50);


回答3:

This looks like something that you will have to implement yourself by modifying the library to your needs.

It is currently not possible by default to have multiple lines on the x-axis. The reason therefore is that Android Canvas cannot simply plot a string e.g. like this "Line 1\nLine2" as two lines.



回答4:

No need to offset x coordinate. And for multi-line scenario the code should be

@Override
protected void drawLabel(Canvas c, String formattedLabel, float x, float y, MPPointF anchor, float angleDegrees) {
    String lines[] = formattedLabel.split("\n");
    for (int i = 0; i < lines.length; i++) {
        float vOffset = i * mAxisLabelPaint.getTextSize();
        Utils.drawXAxisValue(c, lines[i], x, y + vOffset, mAxisLabelPaint, anchor, angleDegrees);
    }
}


回答5:

Use the @Guillaume Jounel answer and then add:

XAxis xAxis = lineChart.getXAxis();    
xAxis.setLabelRotationAngle(-30f);


回答6:

Improved version of @Guillaume Jounel's answer to support multiple newlines, as well as strings w/o a newline.

    @Override
    protected void drawLabel(Canvas c, String formattedLabel, float x, float y,
                                 MPPointF anchor, float angleDegrees) {
    String line[] = formattedLabel.split("\n");
    Utils.drawXAxisValue(c, line[0], x, y, mAxisLabelPaint, anchor, angleDegrees);
        for (int i = 1; i < line.length; i++) { // we've already processed 1st line
             Utils.drawXAxisValue(c, line[i], x, y + mAxisLabelPaint.getTextSize() * i,
                 mAxisLabelPaint, anchor, angleDegrees);
        }
    }