title: ngx-charts legend position is wrong
body: <p>Hello to all developers,</p>
  
  <p>I have been working with ngx-charts to do my charts, so far everything is good but when i try to move the position of the legend to below, its like it goes beyond the boundaries of the chart and no matter what I do I can't see it properly and there is a space reserved to the side as if it were going to be placed there.</p>
  
  <p>I share a bit of the code I was using and a small image to sample.</p>
  
  <pre><code>&lt;div class="widget-body"&gt;
     &lt;div class="clearfix" style="height: 450px; padding: 0px"&gt;
        &lt;i class="fa fa-spin fa-spinner fa-5x center-spinner" *ngIf="salesSpinner == true"&gt;&lt;/i&gt;
        &lt;ngx-charts-line-chart *ngIf="salesSpinner == false"
           [scheme]="colorScheme"
           [results]="salesData"
           [legend]="legend"
           legendPosition="below"
           [xAxis]="showXAxis"
           [yAxis]="showYAxis"
           [showXAxisLabel]="showXAxisLabel"
           [showYAxisLabel]="showYAxisLabel"
           [xAxisLabel]="xAxisLabel1"
           [yAxisLabel]="yAxisLabel1"&gt;
           &lt;/ngx-charts-line-chart&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>If you see the link below you will notice the legend is out of boundaries and not showing.</p>
  
  <p><a href="https://gyazo.com/b3e94590e1d78c6c75c517a5a4568bf1" rel="nofollow noreferrer">Chart image</a></p>