Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix positioning on the xLabels #1359

Closed
chuynadamas opened this issue Aug 25, 2016 · 15 comments
Closed

Fix positioning on the xLabels #1359

chuynadamas opened this issue Aug 25, 2016 · 15 comments
Labels

Comments

@chuynadamas
Copy link
Contributor

Hi guys! @liuxuan30 @PhilJay first of all! thanks for always answer my silly questions! and also congratulations for the new release! is very awesome!

In other hand, I justa wanna know if there is a possibility to get the same positioning over the xLabels that we can find on the Android wiki when we are working with group of bars.

I'm using 3.0

I want to success the following look and feel.
screen shot 2016-08-25 at 1 01 37 pm

As you can see the labels over the xAxis are in the middle of every group. I'm following the same configurations over the group bars but I have the following result.

screen shot 2016-08-25 at 1 07 20 pm

In this case the positions of the x labels are in the beginning of the group.

  • Do you think that i need to do this manually over the x values of every entry or i just missing to setting something?

Thanks in advance.

@danielgindi
Copy link
Collaborator

@PhilJay this is definitely something we need to think about :-) It's a common practice to center the labels based on the whole group. So maybe offset the center of the labels by an X value that is equal to half the group minus half a bar?

@PhilJay
Copy link
Collaborator

PhilJay commented Aug 30, 2016

Yes, we should think about that. However, this should already be possible, as the screenshot from the wiki (the one with orange/yellow bars) has been taken from a real example that I created. This is just a modified version of this example: https://github.com/PhilJay/MPAndroidChart/blob/master/MPChartExample/src/com/xxmassdeveloper/mpchartexample/BarChartActivityMultiDataset.java

@chuynadamas
Copy link
Contributor Author

Hi @PhilJay , @danielgindi

I found that you are using the property centerAxisLabelsEnabled I added to my project and it seems that works for little sets, when I increase the number of the sets the labels begin to misplace the position.

_Small Sets_
screen shot 2016-08-31 at 12 51 17 pm

_Increasing the Sets_
screen shot 2016-08-31 at 12 52 01 pm

As you can see, the first labels are ok, but March, April and May are completely misplaced, also if you pay attention you will notice that the set of May doesn't show complete. I'll open another issue to work with this.

Thanks in advance.

@danielgindi
Copy link
Collaborator

Does this still happen with master?

@chuynadamas
Copy link
Contributor Author

I'm on 61d10ba and still happens, please check the images.

screen shot 2016-09-29 at 12 48 17 pm

With less elements
screen shot 2016-09-29 at 12 49 51 pm

@danielgindi
Copy link
Collaborator

@PhilJay I think this is the last thing we need to take care of before the release. Other stuff is already pretty well tested and many bugs fixed until now.

@PhilJay
Copy link
Collaborator

PhilJay commented Oct 18, 2016

I just tested it on Android once more, using multiple bars and grouping them. I cannot reproduce the issue. Could this be a bug just on iOS or does it work with the latest master code?

I can produce the following result with 4 grouped bars:

screenshot_20161018-221040

XAxis configuration:

    XAxis xAxis = mChart.getXAxis();
    xAxis.setGranularity(1f); // min interval 1f (1 year in this case)
    xAxis.setCenterAxisLabels(true); // center labels over groups
    xAxis.setValueFormatter(new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            return String.valueOf((int) value);
        }

        @Override
        public int getDecimalDigits() {
            return 0;
        }
    });

Data configuration:

        float groupSpace = 0.08f;
        float barSpace = 0.03f; // x4 dataset
        float barWidth = 0.2f; // x4 dataset
        // (0.2 + 0.03) * 4 + 0.08 = 1.00 -> interval per "group"

        int startYear = 1980;
        int endYear = 1986;

        ArrayList<BarEntry> yVals1 = new ArrayList<BarEntry>();
        ArrayList<BarEntry> yVals2 = new ArrayList<BarEntry>();
        ArrayList<BarEntry> yVals3 = new ArrayList<BarEntry>();
        ArrayList<BarEntry> yVals4 = new ArrayList<BarEntry>();

        for (int i = startYear; i < endYear; i++) {
            yVals1.add(new BarEntry(i, ...));
            yVals2.add(new BarEntry(i, ...));
            yVals3.add(new BarEntry(i, ...));
            yVals4.add(new BarEntry(i, ...));
        }

        BarDataSet  set1 = new BarDataSet(yVals1, "Company A");
        set1.setColor(Color.rgb(104, 241, 175));
        BarDataSet  set2 = new BarDataSet(yVals2, "Company B");
        set2.setColor(Color.rgb(164, 228, 251));
        BarDataSet  set3 = new BarDataSet(yVals3, "Company C"); 
        set3.setColor(Color.rgb(242, 247, 158));
        BarDataSet set4 = new BarDataSet(yVals4, "Company D");
        set4.setColor(Color.rgb(255, 102, 0));

        BarData data = new BarData(set1, set2, set3, set4);
        data.setValueFormatter(new LargeValueFormatter());
        data.setBarWidth(barWidth);
        mChart.setData(data);

        // restrict x-axis range
        mChart.getXAxis().setAxisMinimum(startYear);
        mChart.getXAxis().setAxisMaximum(endYear);
        mChart.groupBars(startYear, groupSpace, barSpace);
        mChart.invalidate();

Please look for any differences between this setup and the one you are having issues with and let me know. I will investigate iOS as well.

@danielgindi
Copy link
Collaborator

You are looking at the bar labels, not at the x-axis labels :-)

@danielgindi
Copy link
Collaborator

My mistake! In simple grouped bars it works. Proof is the demo of Multiple Bars.

The problem that is left is with Combined Chart. We are discussing this, and will post a fix.

@danielgindi
Copy link
Collaborator

Silly me. centerAxisLabelsEnabled was missing for the xAxis in the Combined Chart demo.

Guys, always check centerAxisLabelsEnabled when wanting centered xAxis labels...

@iad24
Copy link

iad24 commented Jul 3, 2017

@danielgindi first great charts u got here.

I doing the same thing here - a grouped bar chart with dynamic number of groups. How can I adjust the space between the labels? So it can accommodate as many groups I can put.

@abhilasha25
Copy link

lables should show only after a period like :- jan apr jul please help?

@jheimes-silveira
Copy link

in my case I found a way to leave it depending on the amount of series;
//Exemple

val n = 4 // numero de series
val groupSpace = calcGroupSpace(n)
val barSpace = calcBarSpace(n)
val barWidth = calcBarWith(n)

private fun calcBarWith(n: Int): Float {
return 20/(23*n +8f)
}

private fun calcBarSpace(n: Int): Float {
return 3/(23*n +8f)
}

private fun calcGroupSpace(n: Int): Float {
return 8/(23*n +8f)
}

@muhammedfayazp
Copy link

Hi guys! @liuxuan30 @PhilJay first of all! thanks for always answer my silly questions! and also congratulations for the new release! is very awesome!

In other hand, I justa wanna know if there is a possibility to get the same positioning over the xLabels that we can find on the Android wiki when we are working with group of bars.

I'm using 3.0

I want to success the following look and feel.
screen shot 2016-08-25 at 1 01 37 pm

As you can see the labels over the xAxis are in the middle of every group. I'm following the same configurations over the group bars but I have the following result.

screen shot 2016-08-25 at 1 07 20 pm

In this case the positions of the x labels are in the beginning of the group.

  • Do you think that i need to do this manually over the x values of every entry or i just missing to setting something?

Thanks in advance.

Is this fixed??

@gurpreetKobe
Copy link

gurpreetKobe commented May 31, 2022

Facing the same issue with grouped bar chart. When I have 1 or 2 data sets, labels are centered but when there are 3 data sets, last few labels are not aligned center to the group.

Screenshot 2022-05-31 at 16 01 46

Screenshot 2022-05-31 at 16 02 06

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

8 participants