Facing alignment isseu with topLabelComponent

[MUZAFFAR-PURELOGICS]

Description

Some time getting alignment at the center of bar which should be display on the top of bar.

Specifications: => I am using macbook M1. => "react-native": "0.74.3", => "react-native-gifted-charts": "^1.4.32", . You can see wrong display image:

You can see right display image:

Steps to reproduce

Open screen where graph is displaying. Go back to another screen and then navigate to graph screen. Try this again and again quick. You will see

Snack or a link to a repository

No response

version of react-native-gifted-charts

1.4.32

React Native version

0.74.3

Platforms

iOS

Workflow

None

[Abhinandan-Kushwaha]

@MUZAFFAR-PURELOGICS are you using the isAnimated prop?

[MUZAFFAR-PURELOGICS]

Yes, I am using @Abhinandan-Kushwaha

[Abhinandan-Kushwaha]

Can you share the code @MUZAFFAR-PURELOGICS ?

[MUZAFFAR-PURELOGICS]

@Abhinandan-Kushwaha here is the graph component code:

import {BarChart} from 'react-native-gifted-charts'; import {View, Text, StyleSheet} from 'react-native'; import React from 'react'; import Theme from '../styles/Theme';

const GraphComp = ({title, graphData}) => {

let updatedData = graphData?.map(item => ({ label: 'J' + item?.x_axis, value: item?.y_axis, frontColor: Theme.colors.primary, topLabelComponent: () => {item?.y_axis.toFixed(1) + '%'}, }));

return (

{title}

); };

const styles = StyleSheet.create({ container: { flex: 1, paddingLeft: 5, paddingTop: 20, paddingBottom: 20, borderRadius: 20, borderWidth: 1, borderColor: Theme.colors.darkGreen, backgroundColor: Theme.colors.white, }, title: { textAlign: 'center', fontSize: 20, fontWeight: 'bold', marginBottom: 0, color: '#333', }, xAxisLabel: { color: '#666', fontSize: 12, marginTop: 5, }, yAxisLabel: { color: '#666', fontSize: 12, }, });

export default GraphComp;