CODEWITHSUNDEEP
javascriptreactjsrecharts
DenisPaul
DenisPaul

Reputation: 23

Increase the space between YAxis label in re-charts?

    <ResponsiveContainer width="100%" height="100%">
      <BarChart
        data={data}
        layout="vertical"
        margin={{
          top: 40, right: 40, bottom: 20, left: 100
        }}

      >
        <CartesianGrid strokeDasharray="1 1" />
        <XAxis interval={0} type="number" dataKey="race" />
        <YAxis offset={100} type="category" dataKey="name" style={{ fontSize: '12px' }} />
        <Tooltip />
        <Legend />
        <Bar dataKey="race" fill="#4246e7" barSize={100} />
      </BarChart>
    </ResponsiveContainer>

I want to add some space between races in the left part, but it doesn't work.

I tried with margin but the CSS doesn't apply

enter image description here

Upvotes: 3

Views: 1423

Answers (1)

Saim Abbas
Saim Abbas

Reputation: 1

Give dx={15} for horizontal spacing and dy={15} for vertical spacing.

Upvotes: 0

Related Questions