title: Recharts - align axis label in the left side
body: <p>I am creating a horizontal bar graph using <code>recharts</code> library. I want to align the y-axis label in the left side.</p>
  
  <pre><code>&lt;BarChart width={400} height={300} data={data} layout="vertical" margin={{right: 40}}&gt;
     &lt;XAxis hide axisLine={false} type="number"/&gt;
     &lt;YAxis dataKey="name" type="category" axisLine={false} tickLine={false} /&gt;
     &lt;Bar dataKey="pv" stackId="a" barSize={15} radius={[20,20,20,20]} fill="#8884d8" background={{fill: "#eee", radius: [20,20,20,20]}} tick={false} /&gt;
     &lt;Bar dataKey="uv" stackId="a" barSize={15} radius={[20,20,20,20]} fill="#eee" &gt;
       &lt;LabelList dataKey="amt" position="right" /&gt;
     &lt;/Bar&gt;
  &lt;/BarChart&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/L3macevm/13/" rel="nofollow noreferrer">Jsfiddle</a></p>