MP Chart Labels are repeating frequently and not allowing to make groups

Question

I'm using Android MPChart library to show multiple bars in a group but I'm getting issue of repeating some labels in x-axis. I've tried with

  ValueFormatter xAxisFormatter = new DayAxisValueFormatter(chart, array);
    XAxis xAxis = chart.getXAxis();
    xAxis.setCenterAxisLabels(true);//To align Center
    xAxis.setGranularity(1f); // only intervals of 1 day
    xAxis.setGranularityEnabled(false); // To remove duplicate values
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setDrawGridLines(false);
    xAxis.setLabelCount(dayDataList.size(), true);

But I'm not sure why I'm getting wrong values in return while using

   xAxis.setValueFormatter(new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            Log.e("TAG_VALUE", " is "+(int)value);
            return xAxisLabel.get((int) value);
        }
    });

Here I'm adding the complete source code which shows how I'm adding the data

private void initializeView() {
    chart.setOnChartValueSelectedListener(this);
    chart.setDrawBarShadow(false);

    //Hide/Display texts over bars
    chart.setDrawValueAboveBar(false);

    chart.getDescription().setEnabled(false);

    // if more than 60 entries are displayed in the chart, no values will be
    // drawn
    chart.setMaxVisibleValueCount(60);

    chart.setDrawGridBackground(false);
    chart.setScaleEnabled(false);

    String[] array = null;
    final ArrayList<String> xAxisLabel = new ArrayList<>();

    //X-Axis for 24hours data
    if (dayDataList != null && dayDataList.size() > 0) {
        //TODO : Static Array
        array = new String[]{"1","2","3", "4","5", "6","7" ,"8","9", "10", "11","12", "13","14",
                "15","16", "17","18", "19","20","21", "22","23", "24"};

        for (int i = 1; i <= 24; i++) {
            xAxisLabel.add(String.valueOf(i));
        }
    }


    //X-axis
    ValueFormatter xAxisFormatter = new DayAxisValueFormatter(chart, array);
    XAxis xAxis = chart.getXAxis();
    xAxis.setCenterAxisLabels(true);//To align Center
    xAxis.setGranularity(1f); // only intervals of 1 day
    xAxis.setGranularityEnabled(false); // To remove duplicate values
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setDrawGridLines(false);
    xAxis.setLabelCount(dayDataList.size(), true);
    xAxis.setValueFormatter(new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            Log.e("TAG_VALUE", " is "+(int)value);
            return xAxisLabel.get((int) value);
        }
    });


    //Left Side Y-axis
    ValueFormatter custom = new MyValueFormatter("$");
    YAxis leftAxis = chart.getAxisLeft();
    leftAxis.setLabelCount(8, false);
    leftAxis.setValueFormatter(custom);
    leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
    leftAxis.setSpaceTop(15f);
    leftAxis.setAxisMinimum(0f); // this replaces setStartAtZero(true)

    //Right side Y-axis
    YAxis rightAxis = chart.getAxisRight();
    rightAxis.setDrawGridLines(false);
    rightAxis.setLabelCount(8, false);
    rightAxis.setValueFormatter(custom);
    rightAxis.setSpaceTop(15f);
    rightAxis.setAxisMinimum(0f); // this replaces setStartAtZero(true)

    //To hide/Display Y axis labels
    rightAxis.setEnabled(false);
    leftAxis.setEnabled(false);

    Legend l = chart.getLegend();
    l.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
    l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
    l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
    l.setDrawInside(false);
    l.setForm(Legend.LegendForm.SQUARE);
    l.setFormSize(9f);
    l.setTextSize(11f);
    l.setMaxSizePercent(1f);
    l.setXEntrySpace(4f);

    XYMarkerView mv = new XYMarkerView(getActivity(), xAxisFormatter);
    mv.setChartView(chart); // For bounds control
    chart.setMarker(mv); // Set the marker to the chart

    //Set Data
    setData();
    chart.invalidate();
    chart.setGridBackgroundColor(Color.rgb(234, 244, 255));//Set as a black
    chart.setDrawGridBackground(true);//set this to true to draw the grid background, false if not
}


private void setData() {

    int startYear = 1980;
    int endYear = startYear +24;

    List<BarEntry> yVals1 = new ArrayList<BarEntry>();
    List<BarEntry> yVals2 = new ArrayList<BarEntry>();

    /*for (int i = startYear; i < endYear; i++) {
        yVals1.add(new BarEntry(i, 0.4f));
    }
    for (int i = startYear; i < endYear; i++) {
        yVals2.add(new BarEntry(i, 0.7f));
    }*/


    ArrayList<BarEntry> values1 = new ArrayList<>();
    ArrayList<BarEntry> values2 = new ArrayList<>();

    if (dayDataList != null && dayDataList.size() > 0) {

        for (int i = 0; i < dayDataList.size(); i++) {
            values1.add(new BarEntry(i, (dayDataList.get(i).getDownloadedData()).floatValue()));
            values2.add(new BarEntry(i, (dayDataList.get(i).getUploadedData()).floatValue()));
        }

    }

    BarDataSet set1, set2;
    if (chart.getData() != null && chart.getData().getDataSetCount() > 0) {

        set1 = (BarDataSet) chart.getData().getDataSetByIndex(0);
        set2 = (BarDataSet) chart.getData().getDataSetByIndex(1);

        set1.setValues(values1);
        set2.setValues(values2);

        set1.setValues(yVals1);
        set2.setValues(yVals2);
        chart.getData().notifyDataChanged();
        chart.notifyDataSetChanged();

    } else {
        // create 2 DataSets
        set1 = new BarDataSet(values1, "Company A");
        set1.setColor(Color.rgb(104, 241, 175));
        set2 = new BarDataSet(values2, "Company B");
        set2.setColor(Color.rgb(164, 228, 251));

        BarData data = new BarData(set1, set2);
        data.setValueFormatter(new LargeValueFormatter());
        chart.setData(data);
    }

    set1.setDrawIcons(false);
    set1.setDrawValues(false);//TODO: To hide/show text above bars

    set2.setDrawIcons(false);
    set2.setDrawValues(false);

    int startColor = ContextCompat.getColor(getActivity(), R.color.colorPrimary);
    int endColor = ContextCompat.getColor(getActivity(), R.color.colorPrimaryDark);
    set1.setGradientColor(startColor, endColor);

    int set2StartColor = ContextCompat.getColor(getActivity(), R.color.colorOrange);
    int set2EndColor = ContextCompat.getColor(getActivity(), R.color.colorRedWifi);
    set2.setGradientColor(set2StartColor, set2EndColor);

    ArrayList<IBarDataSet> dataSets = new ArrayList<>();
    dataSets.add(set1);
    dataSets.add(set2);

    BarData data = new BarData(dataSets);
    data.setValueTextSize(10f);
    data.setBarWidth(0.4f);
    chart.getLegend().setEnabled(false);
    chart.setData(data);
    chart.setEnabled(true);

    float barSpace = 0.02f;
    float groupSpace = 0.1f;
    int groupCount = dayDataList.size();

    data.setBarWidth(0.15f);
    chart.getXAxis().setAxisMinimum(0);
    chart.getXAxis().setAxisMaximum(0 + chart.getBarData().getGroupWidth(groupSpace, barSpace) * groupCount);
    chart.groupBars(0, groupSpace, barSpace);
   }

Hope someone can help me in it.

Answer 1

The first thing I see is that you modify the chart after a call to Invalidate(), you must now that Invalidate() allow to refresh the chart, any changes after that will not be applied, better do something like:

//Set Data
setData();
chart.setGridBackgroundColor(Color.rgb(234, 244, 255));//Set as a black
chart.setDrawGridBackground(true);//set this to true to draw the grid background, false if not
chart.invalidate();

Concerning your data, I don't know why you call chart.setData() twice, you can do:

private void setData() {

    int startYear = 1980;
    int endYear = startYear +24;

   //This is not use you can remove it
   /*List<BarEntry> yVals1 = new ArrayList<BarEntry>();
    List<BarEntry> yVals2 = new ArrayList<BarEntry>();

    for (int i = startYear; i < endYear; i++) {
        yVals1.add(new BarEntry(i, 0.4f));
    }
    for (int i = startYear; i < endYear; i++) {
        yVals2.add(new BarEntry(i, 0.7f));
    }*/


    ArrayList<BarEntry> values1 = new ArrayList<>();
    ArrayList<BarEntry> values2 = new ArrayList<>();

    if (dayDataList != null && dayDataList.size() > 0) {

        for (int i = 0; i < dayDataList.size(); i++) {
            values1.add(new BarEntry(i, (dayDataList.get(i).getDownloadedData()).floatValue()));
            values2.add(new BarEntry(i, (dayDataList.get(i).getUploadedData()).floatValue()));
        }

    }

    BarDataSet set1, set2;
    if (chart.getData() != null && chart.getData().getDataSetCount() > 0) {

        set1 = (BarDataSet) chart.getData().getDataSetByIndex(0);
        set2 = (BarDataSet) chart.getData().getDataSetByIndex(1);

        set1.setValues(values1);
        set2.setValues(values2);

        //set1.setValues(yVals1);
        //set2.setValues(yVals2);

        chart.getData().notifyDataChanged();
        chart.notifyDataSetChanged();

    } else {
        // create 2 DataSets
        set1 = new BarDataSet(values1, "Company A");
        set1.setColor(Color.rgb(104, 241, 175));
        set2 = new BarDataSet(values2, "Company B");
        set2.setColor(Color.rgb(164, 228, 251));

        //You will add your data later again, no need of this one
        /*BarData data = new BarData(set1, set2);
        data.setValueFormatter(new LargeValueFormatter());
        chart.setData(data);*/
    }

    set1.setDrawIcons(false);
    set1.setDrawValues(false);//TODO: To hide/show text above bars

    set2.setDrawIcons(false);
    set2.setDrawValues(false);

    int startColor = ContextCompat.getColor(getActivity(), R.color.colorPrimary);
    int endColor = ContextCompat.getColor(getActivity(), R.color.colorPrimaryDark);
    set1.setGradientColor(startColor, endColor);

    int set2StartColor = ContextCompat.getColor(getActivity(), R.color.colorOrange);
    int set2EndColor = ContextCompat.getColor(getActivity(), R.color.colorRedWifi);
    set2.setGradientColor(set2StartColor, set2EndColor);

    //No need of this
    /*ArrayList<IBarDataSet> dataSets = new ArrayList<>();
    dataSets.add(set1);
    dataSets.add(set2);*/

    BarData data = new BarData(set1, set2);
    data.setValueTextSize(10f);
    data.setBarWidth(0.4f);
    chart.getLegend().setEnabled(false);
    chart.setData(data);
    chart.setEnabled(true);

    float barSpace = 0.02f;
    float groupSpace = 0.1f;
    int groupCount = dayDataList.size();

    data.setBarWidth(0.15f);
    chart.groupBars(0, groupSpace, barSpace);
    chart.getXAxis().setAxisMinimum(0);
    chart.getXAxis().setAxisMaximum(groupCount);
   }