Increase space between legend and chart

Question

I am using ng2 chart with angular 7. I have a piechart

How to increase space between the legend and the chart?

I am trying to this, but it doesn't work.

public pieChartOptions: ChartOptions = {
    responsive: true,

    rotation: 0,

    plugins: {
      afterFit: function(chart, options) {
        chart.plugins.register({
          afterFit: function() {
            this.height = this.height + 150;
          },
        })
      },

      datalabels: {
        align: 'end',
        anchor: 'end',
        formatter: (value, ctx) => {
          const label = ctx.chart.data.labels[ctx.dataIndex];
          return value + '% ';
        },

        font: {
          weight: 'bold',
          size: 16,
        }
      }
    }
  };

Answer 1

@gowtham rajan is correct, based on this answer you can use a simple inline plugin to do the job:

{
  beforeInit: function(chart, options) {
    chart.legend.afterFit = function() {
      this.height += 100; // must use `function` and not => because of `this`
    };
  }
}

See this stackblitz for example