简体   繁体   中英

MPAndroidChart chart vertically resizes on dataset change when x-axis labels are rotated

The problem is my MPAndroidChart bar chart vertically resizes when I change the data set. My bottom x-axis labels are 45deg rotated and this is what causes the issue. When bottom x labels are not rotated - no resize occurs.

在此处输入图像描述

I attach a scrreenshot of how the bar chart looks before and after updating the data set.

Does anyone know how to get rid of the chart unintentional resizing?

Edit (+Code)

Hereby I attach the code that demonstrates the problem:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingStart="10dp"
    android:paddingEnd="10dp"
    android:paddingBottom="16dp">

    <com.github.mikephil.charting.charts.BarChart
        android:id="@+id/stackedbarchart_statistics_b"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:layout_marginTop="226dp"/>

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Refresh data set"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="100dp"/>
    
</FrameLayout>

The layout:

 <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingStart="10dp" android:paddingEnd="10dp" android:paddingBottom="16dp"> <com.github.mikephil.charting.charts.BarChart android:id="@+id/stackedbarchart_statistics_b" android:layout_width="match_parent" android:layout_height="300dp" android:layout_marginTop="226dp"/> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Refresh data set" android:layout_gravity="center_horizontal" android:layout_marginTop="100dp"/> </FrameLayout>

Add implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0' in gradle.

As far as my knowledge & the test result, there don't seem to be any easy solution here without modifying the library. The imprecise solution is to make all XAxis label in the similar width (cannot be 100% precise all the time) by:

  1. Left padding the XAxis label text with a non-space character
  2. Apply reasonable maximum value of YAxis through leftYAxis.setAxisMaximum()
  3. Use Monospace font, so that at least for alphanumeric characters, width will be similar.

Code Update for Testing:

        ....
        String number = mFormat.format(value + 1) + ")";
        int repetitions = 1 + random.nextInt(16);
        String name = new String(new char[repetitions]).replace("\0", "a");
        String xLabel = number + name;

        //Update Starts Here: Left padding with '*'
        xLabel = String.format("%17s", xLabel).replace(' ', '*');
        //Ends Here:

        if (xLabel.length() > MAX_LENGTH){
        ....

and

        ...
        final YAxis rightYAxis = barChart.getAxisRight();
        rightYAxis.setEnabled(false);

        //Update Starts Here:
        leftYAxis.setAxisMaximum(3f);
        xAxis.setGranularityEnabled(true);
        xAxis.setTextSize(10f);
        xAxis.setTypeface(Typeface.MONOSPACE); //Use monospace
        //Ends Here:

        barChart.setVisibleXRangeMaximum(3f); // Needs invalidate() before changes take place
        ...

结果

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM