score:1

Accepted answer

the position of the legend can be defines through the options position and align as follows:

options: {   
  legend: {
    position: 'right',
    align: 'start'
  }
  ...

please have a look at your amended code below.

const labels_most_forked = ['html', 'typescript', 'ruby', 'others', 'javascript'];
const values_most_forked = [13, 7, 5, 1, 1];

var mychart = new chart('mychart', {
  type: 'pie',
  data: {
    labels: labels_most_forked,
    datasets: [{
      label: '# of votes',
      data: values_most_forked,
      backgroundcolor: [
        'rgba(255, 99, 132, 1)',
        'rgba(54, 162, 235, 1)',
        'rgba(255, 206, 86, 1)',
        'rgba(75, 192, 192, 1)',
        'rgba(153, 102, 255, 1)',
        'rgba(255, 159, 64, 1)'
      ],
      bordercolor: [
        'rgba(255,99,132,1)',
        'rgba(54, 162, 235, 1)',
        'rgba(255, 206, 86, 1)',
        'rgba(75, 192, 192, 1)',
        'rgba(153, 102, 255, 1)',
        'rgba(255, 159, 64, 1)'
      ],
      borderwidth: 1
    }]
  },
  options: {   
    legend: {
      position: 'right',
      align: 'start'
    }
  }
});
canvas {
  max-width: 400px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.3/chart.min.js"></script>
<canvas id="mychart"></canvas>


Related Query