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

layout misalignment on bar ColumnChart #60

Open
jossephus opened this issue Dec 11, 2024 · 6 comments
Open

layout misalignment on bar ColumnChart #60

jossephus opened this issue Dec 11, 2024 · 6 comments

Comments

@jossephus
Copy link

Hello, Thanks for this awesome library. I enjoy using it so much.

I am currently facing an issue where the numbers in the vertical line is misalinging with the vertical line as shown by the picture. Is this fixable. I will provide code to reproduce it later if needed

image

@ehsannarmani
Copy link
Owner

Hi @jossephus , please provide your code.

@jossephus
Copy link
Author

Hi. Thanks for replying fast. Here is my code using custom list values. Although these values are exactly the ones i am getting from my api request, the problem doesnt happen anymore when i do this. I think it is weird

Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(top = 16.dp),
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            val chartColors = listOf(
                Color(0xFF0AB39C),
                Color(0xFF405189),
                Color(0xFFF06548)
            )

            var earnings = listOf(
                2250,
                1200,
                1000,
            )

            Card(
                modifier = Modifier
                    .padding(top = 5.dp, start = 10.dp, end = 10.dp)
                    .fillMaxWidth()
                    .surface(
                        shape = MaterialTheme.shapes.extraSmall,
                        backgroundColor = MaterialTheme.colorScheme.surface,
                        border = null,
                        shadowElevation = 2.dp
                    )
                    .padding(start = 10.dp, end = 10.dp, bottom = 10.dp),
                colors = CardDefaults.cardColors(
                    containerColor = Color.Transparent
                ),
                shape = MaterialTheme.shapes.medium
            ) {

                ColumnChart(
                    modifier = Modifier
                        .height(200.dp)
                        .padding(top = 3.dp, bottom = 15.dp, start = 22.dp, end = 22.dp),
                    gridProperties = GridProperties(
                        enabled = false,
                    ),
                    labelProperties = LabelProperties(
                        enabled = false,
                    ),
                    data = listOf(
                        Bars(
                            label = "",
                            values = listOf(
                                Bars.Data(
                                    value = earnings[0].toDouble()
                                        ?: 0.0,
                                    color = SolidColor(chartColors[0]),
                                ),
                            )
                        ),
                        Bars(
                            label = "",
                            values = listOf(
                                Bars.Data(
                                    label = null,
                                    value = (earnings[1].toDouble() ?: 0.0),
                                    color = SolidColor(chartColors[1])
                                ),
                            )
                        ),
                        Bars(
                            label = "",
                            values = listOf(
                                Bars.Data(
                                    value = earnings[2].toDouble()
                                        ?: 0.0,
                                    color = SolidColor(chartColors[2])
                                ),
                            )
                        ),
                    ),
                    barProperties = BarProperties(
                        cornerRadius = Bars.Data.Radius.Rectangle(
                            topRight = 6.dp,
                            topLeft = 6.dp
                        ),
                        spacing = 30.dp,
                        thickness = 50.dp,
                    ),
                    animationSpec = spring(
                        dampingRatio = Spring.DampingRatioMediumBouncy,
                        stiffness = Spring.StiffnessLow
                    ),
                    labelHelperProperties = LabelHelperProperties(
                        enabled = false,
                    )
                )
            }
        }

@ehsannarmani
Copy link
Owner

@jossephus Which version of the library you are using?

@jossephus
Copy link
Author

I am using "0.0.17". (sorry for the late reply)

@ehsannarmani
Copy link
Owner

Please test 0.1.0 version and let me notified if issue still exists.

@yashwanthgajji
Copy link
Contributor

Hi @ehsannarmani , I have tested this issue in latest version 0.1.0
Issue is not replicating. Attaching screenshots.

1 2

@jossephus please confirm.

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

No branches or pull requests

3 participants