When I made a bar graph with MPAndroidChart, the x-axis label was misaligned for some reason

Introduction

I happened to have the opportunity to develop a simple app using Android Studio. When I wanted to draw a graph in it, I found that I should use a library called "MPAndroidChart", so I made a bar graph while referring to some sites. However, I had a hard time setting the x-axis label for about an hour, so I will describe the process and the solution. (If you have the spare capacity, I would like to paste the image that was actually moved later)

Troublesome part

The part that is not related to this problem is largely broken, but the outline is as follows. I refer to this article.

"Creating a simple bar graph with MPAndroidChart" https://qiita.com/iKimishima/items/7fd192a074739cf5290b

MainActivity.java


public class MainActivity extends AppCompatActivity {

    protected BarChart chart;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        chart = (BarChart) findViewById(R.id.chart1);

        //Display data acquisition
        BarData data = new BarData(getBarData());
        chart.setData(data);

        //X axis
        XAxis xAxis = chart.getXAxis();
        //List of Labels to display on the X-axis(the first""Is the position of the origin)
        final String[] labels = {"","Apple", "Mandarin orange", "Peaches"};
        xAxis.setValueFormatter(new IndexAxisValueFormatter(labels));

    }

}

Especially this last part.

xAxis.setValueFormatter(new IndexAxisValueFormatter(labels));

Even on other sites, etc., what is defined in advance as a String array is given as an argument to new IndexAxisValueFormatter, but for some reason the axis may not be displayed properly depending on the data to be assigned. (Originally, apples, oranges, and thighs should be labeled on the three elements, but for some reason, the three elements are labeled as oranges, thighs, and thighs (without labels). Just the contents of labels. It worked in some cases)

solution

Regardless of the reason, I had the feeling that "just move fast", so when I looked it up, I arrived at the following site.

"MPAndroidChart-Adding Labels to Bar Charts" https://www.366service.com/jp/qa/94329e5e85f6eddc6886945506ec0759

Here, there is an explanation that the label is set by creating a formatter without using IndexAxisValueFormatter. The graph was fixed by inserting LabelFormatter into the class you want to use and adjusting the argument of setValueFormatter accordingly.

hoge.java


//Until a while ago
xAxis.setValueFormatter(new IndexAxisValueFormatter(labels));
//After update
xAxis.setValueFormatter(new LabelFormatter(labels));

fuga.java


 public class LabelFormatter implements IAxisValueFormatter {
    private final String[] mLabels;

    public LabelFormatter(String[] labels) {
        mLabels = labels;
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        return mLabels[(int) value];
    }
}

After all

I wasn't sure why the IndexAxisValueFormatter didn't work as intended. I think it has something to do with the version of the library ... Surprisingly, there were few articles around MPAndroidChart, and I could not find a Japanese site that hits a similar wall, so I made it an article although it is a collection of knowledge. For the actual code etc., I think it is better to refer to the following article.

There are many items to set for graphs, and I couldn't find one that was organized in an easy-to-understand manner, so I wanted to organize it myself if I had the opportunity.

Articles that were very helpful

"Creating a simple bar graph with MPAndroidChart" https://qiita.com/iKimishima/items/7fd192a074739cf5290b "MPAndroidChart-Adding Labels to Bar Charts" https://www.366service.com/jp/qa/94329e5e85f6eddc6886945506ec0759

Recommended Posts

When I made a bar graph with MPAndroidChart, the x-axis label was misaligned for some reason
Java: A story that made me feel uncomfortable when I was taught to compare strings with equals for no reason.
Draw a bar graph and a line graph at the same time with MPAndroidChart
I made a check tool for the release module
When the vagrant command doesn't work for some reason
I made a reply function for the Rails Tutorial extension (Part 1)
I checked because the response was strange when debugging with Tomcat 8
I made a reply function for the Rails Tutorial extension (Part 5):
I made a GUI with Swing
A story I was addicted to when testing the API using MockMVC
I was in trouble at work, so I made a plugin for IntelliJ
Problems I was addicted to when building the digdag environment with docker
In DynamoDB Enhanced Client, I access the index table for some reason
I was stuck with the handling of the time zone when formatting with SimpleDateFormat
When I wanted to create a method for Premium Friday, it was already in the Java 8 standard API
Create a simple bar chart with MPAndroidChart
I made a risky die with Ruby
I made a plugin for IntelliJ IDEA
I made a rock-paper-scissors app with kotlin
I made a rock-paper-scissors app with android
The training for newcomers was "Make an app!", So I made an app for the time being.
I was a little addicted to the S3 Checksum comparison, so I made a note.
I made a simple graph library for smartphone apps [MP Android Chart Kai]
A story that I was really into when I did triple DES with ruby
[Must-see for fledgling engineers] A story that the world expanded when I actually operated a web service that I made by myself