[Chartjs]-Changing the label of chart

0👍

You could probably use something like this:

import {Component} from '@angular/core';
import {TranslateService} from '@ngx-translate/core';

@Component({
    selector: 'app',
    template: `
       <canvas baseChart
          [labels]="chartLabels"     
          chartType="pie">
      </canvas>
    `
})
export class AppComponent {
    constructor(private translate: TranslateService) {};

    chartLabels = ["korea", "tokyo", "sydney"]
    translatedChartLabels = []

    ngOnInit() {
        this.translate.get(this.chartLabels)
            .subscribe(translations => {
                /* translations is now an object with { 
                 "key1": "translated value", 
                 "key1": "translated value" } 
                 and needs to be converted to an array again. */
                this.translatedChartLabels = Object.values(translations)
        });
    }
}
 <canvas baseChart
      [labels]="translatedChartLabels"     
      chartType="pie">
 </canvas>

Leave a comment