title: set day and month date in rechart xaxis
body: <p>so i have this data:</p>
  
  <pre><code>const pulseAverage:[
      {
            name:'Pulse Average',
            style:'#5FE3A1',
            category:'Pulse Average',
            id:'right',
            data: [
              { day: '23/05/2020 04:50', value: 80 },
              { day: '24/05/2020 04:50', value: 83 },
              { day: '25/05/2020 04:50', value: 65 },
              { day: '26/05/2020 04:50', value: 72 },
              { day: '27/05/2020 04:50', value: 79 },
              { day: '28/05/2020 04:50', value: 93 },
              { day: '29/05/2020 04:50', value: 96 },
              { day: '30/05/2020 04:50', value: 91 },
              { day: '31/05/2020 04:50', value: 46 },
            ]
          }
  </code></pre>
  
  <p>i have successfully created a bar chart using it and it looks great. however, i have looked up on different stack overflow questions,github issues for a solution and i still can't find anything and sorry if you saw this question before but i'm really desperate for help. my problem is that i need the xaxis to display only the day/month like this and ignore the rest of the information. i need recharts to understand on its xaxis that i only need to display these two( ex: 29/05   30/05   31/05  ...)</p>
  
  <p>code:</p>
  
  <pre><code>&lt;BarChart
          width={1000}
          height={300}
          data={pulseAverage}
          margin={{
            top: 5, right: 30, left: 20, bottom: 5,
          }}
        &gt;
          &lt;CartesianGrid strokeDasharray="5 0" tickSize={15} /&gt;
          &lt;XAxis 
          dataKey="day"  type="category"  tickLine={false} 
          axisLine={false}  dx={-15} allowDuplicatedCategory={false}
          /&gt;
          &lt;YAxis yAxisId="left" orientation="left" dataKey="value" type="number" tickLine={false} axisLine={false} allowDuplicatedCategory={false}/&gt;
          &lt;YAxis yAxisId="right" orientation="right" dataKey="value" type="number" tickLine={false} axisLine={false} allowDuplicatedCategory={false}/&gt;
          &lt;Tooltip /&gt;
          &lt;Legend 
          layout="horizontal" verticalAlign="top" align="center" 
          payload={
              pulseAverage.map(
              item =&gt; ({
                type: "circle",
                id: item.name,
                color: item.style,
                value: `${item.category}`
              })
            )
          }/&gt;
          {pulseAverage.map(s =&gt; (
            &lt;Bar yAxisId={s.id} barSize={10} dataKey="value" data={s.data} key={s.name} name={s.name} fill={s.style}/&gt;          
         ))}
        &lt;/BarChart&gt;
  </code></pre>