React-native-chart-kit: How to hide Y-axis label and shadow line

[azui007]

Hello Hermanya,
I use the LineChart,It looks like this.

Code:

 <LineChart
          data={{
                    labels: ['01', '02', '03', '04'],
                    datasets: [{
                        data: [
                            Math.random() * 100,
                            Math.random() * 100,
                            Math.random() * 100,
                            Math.random() * 100
                        ],
                        color: (opacity = 1) => `rgba(19, 155, 255, ${opacity})`
                    }]
                }}
                width={Dimensions.get('window').width} // from react-native
                height={220}
                withShadow={false}
                withOuterLines={false}
                chartConfig={{
                    withShadow: false,
                    withOuterLines: false,
                    backgroundColor: '#fff',
                    backgroundGradientFrom: '#fff',
                    backgroundGradientTo: '#fff',
                    decimalPlaces: 2, // optional, defaults to 2dp
                    color: (opacity = 1) => `rgba(90, 90, 90, ${opacity})`,
                    style: {
                        borderRadius: 16
                    }
                }}
                bezier
                style={{
                    marginVertical: 8,
                    borderRadius: 16
                }}
            />

I want to hide Y-axis label and shadow line,like this (tootip is not belong to chart)

can you help me

[canpoyrazoglu]

Did you find a solution? I need exactly the same thing: to hide labels completely.

[Hermanya]

There is no out of the box solution for this, but I would welcome a PR.

[i1990jain]

you can usewithHorizontalLabels={false}as a property to your LineChart element

and inside chartConfig use

propsForBackgroundLines:{
                      stroke:"#ffffff"
                    }

or equal to your background color

[OskarJuszczyk]

withHorizontalLabels={false} is not working with StackedBarChart

[zanona]

withHorizontalLabels={false} works on LineChart however it still leaves an empty space to the left of the chart. Ideally, disabling it, would also extend the chart to use the entire available width.

[connoremma]

@azui007 @zanona

Hey guys, taking a look at the source, there is a default paddingRight of 64 if it is not provided in the style prop. So you can set paddingRight to 0 explicitly to get your expected result. I ran into this same problem just now, here's my graph:

And the code:

<Linechart
..some props
style={{ paddingRight: 0 }}
/>