title: apexcharts range bars not displayed correctly
body: <p>I'm trying to display a Range Bar Chart with AppexCharts for team due date tasks (2 tasks or above).</p>
  <p>every task can have multiple bars
  if the number of bars in each task is more than 2 the bars of each task get into each other
  please take a look at this <a href="https://codepen.io/hamza-bouallegue/pen/MWoJVgy" rel="nofollow noreferrer">example</a> that can explain my point clearly .</p>
  <p>Thank you .</p>
  <pre><code>var options = {
            series: [
               {
              name: 'task1',
              data: [
                  {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-01').getTime(),
                    new Date('2021-03-02').getTime()
                  ]
                },
                     {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-02').getTime(),
                    new Date('2021-03-05').getTime()
                  ]
                },
                   {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-01').getTime(),
                    new Date('2021-03-07').getTime()
                  ]
                },
                     {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-02').getTime(),
                    new Date('2021-03-08').getTime()
                  ]
                },
                      {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-01').getTime(),
                    new Date('2021-03-05').getTime()
                  ]
                },
          
              ]
            },
              {
              name: 'task2',
              data: [
                  {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-01').getTime(),
                    new Date('2021-03-10').getTime()
                  ]
                },
              
                   {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-01').getTime(),
                    new Date('2021-03-03').getTime()
                  ]
                },
         
                      {
                  x: 'Team Health',
                  y: [
                    new Date('2021-03-3').getTime(),
                    new Date('2021-03-08').getTime()
                  ]
                },
          
              ]
            },
      
          ],
            chart: {
         height:400,
            type: 'rangeBar'
          },
          plotOptions: {
            bar: {
              horizontal: true,
              barHeight: '80%',
              rangeBarOverlap: false,
        
             columnWidth: '10%',
            }
          },
          xaxis: {
            type: 'datetime',
               position: 'top',
             
          },
          stroke: {
            width: 1
          },
          fill: {
            type: 'solid',
            opacity: 0.6
          },
          legend: {
            position: 'top',
            horizontalAlign: 'center'
          }
          };
  </code></pre>