MPAndroidChart Set month value on X axis and draw line under graph

Question

I am trying to set a value on X axis as month but the y value are not corresponding to x value that I am trying to set.

private void CreateGraph() {
    float[] yDataL = {30, 60, 500,231};
    String[] xDataL = {"Jan", "Feb" , "Mac" , "Apr"};

    LineChart lineChart = (LineChart) findViewById(R.id.chart);

    ArrayList<Entry> yEntrys = new ArrayList<>();
    final ArrayList<String> xEntrys = new ArrayList<>();

    for(int i = 0; i < yData.length; i++){
        yEntrys.add(new Entry(i, yData[i]));
    }

    for(int i = 1; i < xData.length; i++){
        xEntrys.add(xData[i]);
    }

    LineDataSet dataSet = new LineDataSet(yEntrys, "");
    dataSet.setColor(Color.parseColor("#7500ca"));
    dataSet.setCircleColor(Color.parseColor("#7500ca"));
    dataSet.setLineWidth(1f);
    dataSet.setCircleRadius(5f);
    dataSet.setDrawCircleHole(false);
    dataSet.setDrawValues(false);


    XAxis xAxis = lineChart.getXAxis();
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setGranularity(1f);
    xAxis.setGranularityEnabled(true);
    xAxis.setValueFormatter(new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {

            return xEntrys.get((int) value % xEntrys.size());
        }
    });

    YAxis rightAxis = lineChart.getAxisRight();
    rightAxis.setEnabled(false);

    LineData pieData = new LineData(dataSet);
    lineChart.getXAxis().setDrawGridLines(false);
    lineChart.getAxisLeft().setDrawGridLines(false);
    lineChart.getAxisRight().setDrawGridLines(false);
    lineChart.getAxisLeft().setDrawAxisLine(false);
    lineChart.getAxisRight().setDrawAxisLine(false);
    lineChart.getAxisLeft().setDrawLabels(false);
    lineChart.getAxisRight().setDrawLabels(false);
    lineChart.getLegend().setEnabled(false);
    lineChart.setDescription(null);
    lineChart.setData(pieData);
    lineChart.invalidate();
}

this is the result that i got result image

i think i got it wrong on xAxis.setValueFormatter part

i also want to archive a line below the graph like this one image of line below graph

score 0 · Answer 1 · answered Dec 05 '18 at 02:20

For anyone who have the same problem as me, I solve this by change my

xAxis.setValueFormatter(new IAxisValueFormatter() {
    @Override
    public String getFormattedValue(float value, AxisBase axis) {

        return xEntrys.get((int) value % xEntrys.size());
    }
});

to this

xAxis.setValueFormatter(new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            return xData[(int) value]; // xVal is a string array
        }
    });

i think just a calculation mistake.

I tried your solution. But I didn't get the month names on my `x axis`. Also what is `xData` and `yData`? — Moeez, May 04 '21 at 07:20

tiagocarvalho92 · Answer 2 · 2019-12-08T12:51:38.650

This is my implementation in kotlin and using an external class since you may end up using this formatter in multiple places and it'll reduce complexity in the view layer.

Keep in my that there was a change in the formatter interface and now you should use getAxisLabel instead of getFormattedValue

class MonthValueFormatter : ValueFormatter() {

override fun getAxisLabel(value: Float, axis: AxisBase?): String {
    return when (value) {
        0.0f -> "January"
        1.0f -> "February"
        2.0f -> "Mars"
        3.0f -> "April"
        4.0f -> "May"
        5.0f -> "June"
        6.0f -> "July"
        7.0f -> "August"
        8.0f -> "September"
        9.0f -> "October"
        10.0f -> "November"
        11.0f -> "December"
        else -> throw IllegalArgumentException("$value is not a valid month")
    }
  }
}

And then in your view just assim the instance:

xAxis.valueFormatter = MonthValueFormatter()

MPAndroidChart Set month value on X axis and draw line under graph

2 Answers2