MPAndroidChart: How to create grouped BarChart?

Question

I am using MPAndroidChart to create grouped Dataset, but it is showing an error BarData data = new BarData(labels,dataSets ); at this line that is Unable to resolve constructor,BarData(java.util.ArrayList)<java.lang.String>,java.util.ArrayList<com.github.mikephil.charting.data.BarDataSet;> I have also casted IBarDataSet then the Application is getting Unfortunately Stopped. I have used dependency compile 'com.github.PhilJay:MPAndroidChart:v2.2.4'. Somebody Please help me!!

//create BarEntry for group 1
            ArrayList<BarEntry> group1 = new ArrayList<>();
            group1.add(new BarEntry(4f, 0));
            group1.add(new BarEntry(8f, 1));
            group1.add(new BarEntry(6f, 2));
            group1.add(new BarEntry(12f, 3));
            group1.add(new BarEntry(18f, 4));
            group1.add(new BarEntry(9f, 5));

            // create BarEntry for group 2
            ArrayList<BarEntry> group2 = new ArrayList<>();
            group2.add(new BarEntry(6f, 0));
            group2.add(new BarEntry(7f, 1));
            group2.add(new BarEntry(8f, 2));
            group2.add(new BarEntry(12f, 3));
            group2.add(new BarEntry(15f, 4));
            group2.add(new BarEntry(10f, 5));

            // creating dataset for group1
            BarDataSet barDataSet1 = new BarDataSet(group1, "Brand 1");
            barDataSet1.setColors(ColorTemplate.COLORFUL_COLORS);

            // creating dataset for group2
            BarDataSet barDataSet2 = new BarDataSet(group2, "Brand 2");
            barDataSet2.setColors(ColorTemplate.COLORFUL_COLORS);

            // combined all dataset into an arraylist
            ArrayList<BarDataSet> dataSets = new ArrayList<>();
            dataSets.add(barDataSet1);
            dataSets.add(barDataSet2);


            ArrayList<String> labels = new ArrayList<>();
            labels.add("JAN");
            labels.add("FEB");
            labels.add("MAR");
            labels.add("APR");
            labels.add("MAY");
            labels.add("JUN");
            BarData data = new BarData(labels,dataSets );// initialize the Bardata with argument labels and dataSet
            barChartGroup.setData(data);

I want to get the dataset like the following example : -

Thanks!!

score 4 · Answer 1 · edited May 23 '17 at 12:15

Since release v3.0.0 brought a major change related to the drawing of grouped BarChart, you should modify your dependency to get the newest release.

Having said that, how to define the BarData for your data groups? According to the example for "Grouped BarChart" from the official Wiki, you do it like this:

BarData data = new BarData(barDataSet1, barDataSet2 );
barChartGroup.setData(data);

The example also illustrates how to set bar width and gaps between bars/ groups of bars.

By the way, MPandroidChart relies on your entries being sorted. Unsorted lists may or may not be drawn correctly. In addition to that, at least in the example the two groups of entries had the same set of x values, so it may be a good idea to fill in missing values.

About the labels: it seems that presently it's not possible to set labels like you do. For a workaround using a custom ValueFormatter for the x axis see this SO post by TR4Android.

score 1 · Answer 2 · answered Sep 17 '20 at 02:12

here is a full code

 private BarData generateBarData() {

    ArrayList<BarEntry> entries1 = new ArrayList<>();
    ArrayList<BarEntry> entries2 = new ArrayList<>();

    for (int index = 0; index < count; index++) {
        entries1.add(new BarEntry(0, getRandom(25, 25)//your data));

        // stacked
        entries2.add(new BarEntry(0, new float[]{getRandom(13, 12)//your data, getRandom(13, 12)//your data}));
    }

    BarDataSet set1 = new BarDataSet(entries1, "Bar 1");
    set1.setColor(Color.rgb(60, 220, 78));
    set1.setValueTextColor(Color.rgb(60, 220, 78));
    set1.setValueTextSize(10f);
    set1.setAxisDependency(YAxis.AxisDependency.LEFT);

    BarDataSet set2 = new BarDataSet(entries2, "");
    set2.setStackLabels(new String[]{"Stack 1", "Stack 2"});
    set2.setColors(Color.rgb(61, 165, 255), Color.rgb(23, 197, 255));
    set2.setValueTextColor(Color.rgb(61, 165, 255));
    set2.setValueTextSize(10f);
    set2.setAxisDependency(YAxis.AxisDependency.LEFT);

    float groupSpace = 0.06f;
    float barSpace = 0.02f; // x2 dataset
    float barWidth = 0.45f; // x2 dataset
    // (0.45 + 0.02) * 2 + 0.06 = 1.00 -> interval per "group"

    BarData d = new BarData(set1, set2);
    d.setBarWidth(barWidth);

    // make this BarData object grouped
    d.groupBars(0, groupSpace, barSpace); // start at x = 0

    return d;
}

credit https://github.com/PhilJay/MPAndroidChart/blob/master/MPChartExample/src/main/java/com/xxmassdeveloper/mpchartexample/CombinedChartActivity.java

score 0 · Answer 3 · answered May 07 '23 at 23:38

In your case you have two brands { brand 1 , Brand 2 }, MPANDROID Chart support drawing bar explicitly gouped .

In your case , you must create two listbarEntries to assemble data , and two BarDataSet represent each group like this : BarDataSet barDataSet1=new barDataSet (listbarEntries1 ,"Brand1") BarDataSet barDataSet2 =new BarDataSet(listbarEntries2,"Brand2") after that you can add your barDataSet to your BarChart.

Exemple :

BarDataSet barDataSet1 = new BarDataSet(listbarEntries1, "Brand 1");
BarDataSet barDataSet2 = new BarDataSet(listbarEntries2, "Brand 2");
float groupSpace = 0.1f;
float Space = 0.06f; 
float Width = 0.50f; 

BarData data = new BarData(barDataSet1, barDataSet2);
data.setBarWidth(Width); 
barChart.setData(data);
barChart.groupBars(0f, Space, barSpace); 
barChart.invalidate(); // refresh

score 0 · Answer 4 · answered Jun 10 '23 at 08:19

you need to follow below steps:

Step 1: Add the MP Android Chart library to your project. Add the following dependency to your app-level build.gradle file:

    implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'

Step 2: Create a layout file for your chart activity. Create a new XML layout file (e.g., activity_chart.xml) and add a BarChart view to it:

       <com.github.mikephil.charting.charts.BarChart
                    android:id="@+id/barChart"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"/>

Step 3: Set up the chart in your activity. In your activity, initialize the BarChart and set the required properties:

 private void setBarChartData() {
        List<BarEntry> entries1 = new ArrayList<>();
        List<BarEntry> entries2 = new ArrayList<>();
        List<BarEntry> entries3 = new ArrayList<>();

        // Add sample data to entries1 and entries2
        entries1.add(new BarEntry(0f, 20));
        entries1.add(new BarEntry(1f, 30));
        entries1.add(new BarEntry(2f, 15));

        entries2.add(new BarEntry(0f, 10));
        entries2.add(new BarEntry(1f, 25));
        entries2.add(new BarEntry(2f, 5));

        entries3.add(new BarEntry(0f, 44));
        entries3.add(new BarEntry(1f, 20));
        entries3.add(new BarEntry(2f, 11));

        List<String> labels = new ArrayList<>();
        // Add the time label for the x-axis
        labels.add("Label 1","Label 2","Label 3");

        BarDataSet set1 = new BarDataSet(entries1, "Data Set 1");
        set1.setColor(Color.BLUE);

        BarDataSet set2 = new BarDataSet(entries2, "Data Set 2");
        set2.setColor(Color.RED);

        BarDataSet set3 = new BarDataSet(entries3, "Data Set 3");
        set3.setColor(Color.GREEN);

        float groupSpace = 0.4f; // Space between groups
        float barSpace = 0.06f; // Space between individual bars within a group
        float barWidth = 0.14f; // Width of each bar

        BarData barData = new BarData(set1, set2, set3);

        barChart.setData(barData);

        int visibleRange = 2; // Set the desired visible range
        int dataCount = chartList.size(); // Update with the actual size of your data list

        barData.setBarWidth(barWidth);
        barChart.setDragEnabled(true);
        barData.groupBars(0, groupSpace, barSpace);

        barChart.setDrawGridBackground(false);
        barChart.getDescription().setEnabled(false);
        barChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
        barChart.getXAxis().setDrawGridLines(true);
        barChart.getAxisRight().setEnabled(false);
        barChart.setDoubleTapToZoomEnabled(false);
        barChart.animateY(1000);
        
        barChart.setNoDataTextColor(getResources().getColor(R.color.primaryColor));
        barChart.getAxisLeft().setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);

        // Set chart padding
        barChart.setExtraTopOffset(10f);
        barChart.setExtraBottomOffset(10f);
        barChart.setExtraLeftOffset(20f);
        barChart.setExtraRightOffset(10f);

        // Customize x-axis labels
        XAxis xAxis = barChart.getXAxis();
        xAxis.setValueFormatter(new IndexAxisValueFormatter(labels));
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setGranularityEnabled(true);
        xAxis.setCenterAxisLabels(true);
        xAxis.setGranularity(1f); // Display one label per data point
        xAxis.setAxisMinimum(0f);
        xAxis.setAxisMaximum(barData.getGroupWidth(groupSpace, barSpace) * chartList.size());

        YAxis leftAxis = barChart.getAxisLeft();
        leftAxis.setAxisMinimum(0f);
        leftAxis.setDrawGridLines(false);

        barChart.resetZoom();
        barChart.fitScreen();
        barChart.setVisibleXRangeMaximum(2);
        barChart.moveViewToX(0);
        barChart.invalidate();
}

Now call above setBarChartData() function from your activty onCreate() method.

Output chart

That's it! You should now have a group bar chart displayed in your activity using the MP Android Chart library. Adjust the sample data and chart properties as per your requirements.

score -1 · Answer 5 · answered Jan 06 '22 at 07:17

-1

There is a good example here, check it out.

Below is the resulting Grouped BarChart

answered Jan 06 '22 at 07:17

corneliouz Bett

149
1
10

MPAndroidChart: How to create grouped BarChart?

5 Answers5

Linked