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

Bar Chart VerticalLines not rendered. #713

Open
gokulravi2010 opened this issue Nov 2, 2023 · 1 comment
Open

Bar Chart VerticalLines not rendered. #713

gokulravi2010 opened this issue Nov 2, 2023 · 1 comment

Comments

@gokulravi2010
Copy link

gokulravi2010 commented Nov 2, 2023

Hi. We are using Bar chart with a specific data but we are unable to display the y-axis and the verticalLines are not rendered. Is there any way to display y-axis vertical line?

We have written the following code to render the BarGraph:

`const data1 = {
labels: ['January', 'February', 'March', 'April', 'May'],
datasets: [
{
data: [80000, 48000, 28000, 13000, 5000],
colors: [
() => '#94D6E9',
() => '#ABC2AD',
() => '#C89297',
() => '#8F90B0',
() => '#F2C298',
],
strokeWidth: 1,
},
],
};

<BarChart
style={{
alignItems: 'center',
padding: 20,
}}
data={data1}
width={300}
height={300}
chartConfig={{
backgroundColor: 'white',
backgroundGradientFrom: 'white',
backgroundGradientFromOpacity: 0,
backgroundGradientTo: 'white',
decimalPlaces: 0,
color: opacity => rgba(124,124,124,${opacity}),
strokeWidth: 1,
barPercentage: 1,
propsForBackgroundLines: {
strokeDasharray: '',
strokeWidth: 1,
},
fillShadowGradientOpacity: 3,
useShadowColorFromDataset: false,
propsForVerticalLabels: {
fontSize: 13,
fontWeight: '400',
marginLeft: 0,
paddingLeft: 0,
textAlign: 'left',
},
propsForHorizontalLabels: {fontSize: 13, fontWeight: '400'},
}}
withCustomBarColorFromData={true}
flatColor={true}
withVerticalLabels={false}
showBarTops={false}
fromZero={true}
withHorizontalLines={true}
withVerticalLines={true}
withInnerLines={true}
/>`

Output we received:

Output1

Desired Output :

Output2
@bhavesh-trentium
Copy link

@gokulravi2010 Please Add this Props showVerticalLines={true}

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

2 participants