Accepted answer

Your code is correct and you will be able to align the legend as following in the future:

legend: {
    position: "top",
    align: "start"

But the feature is currently not implemented at the current time (2019-03-30). The feature is already merged and will be released with version 2.9. You either have to wait until version 2.9 will be released or use a development release, which is not recommended as they should only be used for testing purposes.


with version 2.9 as suggested in the documentation, use the plugins namespace for e.g.

this.piechart = new Chart(this.ctx, {
      type: 'pie',
      data: data,
      options: {
        plugins: {
          legend: {
            position: 'right',
            align: 'center'

Related Query

More Query from same tag