Remove Y Axis line but keep the values in recharts

Admin 1
Viewed 6874

So I have created this chart using recharts:

Is there a way to remove the YAxis line but keep the values visible? Like remove the line but keep 135, 190, etc.

<div className={styles.lineChart}>
  <h3 className={styles.title}>Body Weight</h3>
  <LineChart
    width={800}
    height={300}
    data={props.data}
    margin={{
      top: 5, right: 30, left: 20, bottom: 5,
    }}
  >
    <CartesianGrid strokeDasharray="3 3" />
    <XAxis dataKey="day" />
    <YAxis />
    <Tooltip />
    <Legend  layout="horizontal" verticalAlign="top" align="center"/>
    <Line type="monotone" dataKey="body weight" stroke="#57c0e8" activeDot={{ r: 8 }} />
  </LineChart>
</div>
recharts reactjs
1 Answers

To hide the YAxis line, you just need to use the props axisLine on the YAxis, and set it to false.

Like this:

<YAxis axisLine={false} />
user_73214620
Related