ng-prime-tools
Version:
An advanced PrimeNG table for Angular
71 lines • 9.25 kB
JavaScript
import { Component, Input, ViewChild, } from '@angular/core';
import { Chart, registerables, } from 'chart.js';
import ChartDataLabels from 'chartjs-plugin-datalabels';
import * as i0 from "@angular/core";
export class PTChartComponent {
constructor() {
Chart.register(...registerables, ChartDataLabels);
}
ngOnInit() {
this.initializeChart();
}
ngOnDestroy() {
this.destroyChart();
}
initializeChart() {
const canvas = this.canvasRef.nativeElement;
// Destroy the existing chart instance if it already exists
this.destroyChart();
const config = {
type: this.chartConfig.type,
data: this.chartConfig.data,
options: {
...this.chartConfig.options,
plugins: {
datalabels: {
formatter: (value, context) => {
const data = context.chart.data.datasets[0].data;
const total = data.reduce((sum, val) => sum + val, 0);
const percentage = ((value / total) * 100).toFixed(1) + '%';
return percentage;
},
color: '#000',
font: {
weight: 'bold',
},
},
...this.chartConfig.options?.plugins,
},
},
};
// Create a new Chart instance
this.chart = new Chart(canvas, config);
}
updateChart() {
if (this.chart) {
this.chart.data = this.chartConfig.data;
if (this.chartConfig.options) {
this.chart.options = this.chartConfig.options;
}
this.chart.update();
}
}
destroyChart() {
if (this.chart) {
this.chart.destroy();
this.chart = undefined;
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: PTChartComponent, selector: "pt-chart", inputs: { chartConfig: "chartConfig" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["chartCanvas"], descendants: true, static: true }], ngImport: i0, template: "<div style=\"position: relative; height: 100%; width: 100%\">\n <canvas #chartCanvas></canvas>\n</div>\n", styles: [""] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTChartComponent, decorators: [{
type: Component,
args: [{ selector: 'pt-chart', template: "<div style=\"position: relative; height: 100%; width: 100%\">\n <canvas #chartCanvas></canvas>\n</div>\n" }]
}], ctorParameters: () => [], propDecorators: { chartConfig: [{
type: Input
}], canvasRef: [{
type: ViewChild,
args: ['chartCanvas', { static: true }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHQtY2hhcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctcHJpbWUtdG9vbHMvc3JjL2xpYi9wdC1jaGFydC9wdC1jaGFydC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1wcmltZS10b29scy9zcmMvbGliL3B0LWNoYXJ0L3B0LWNoYXJ0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUdMLFNBQVMsR0FFVixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQ0wsS0FBSyxFQUVMLGFBQWEsR0FHZCxNQUFNLFVBQVUsQ0FBQztBQUVsQixPQUFPLGVBQWUsTUFBTSwyQkFBMkIsQ0FBQzs7QUFPeEQsTUFBTSxPQUFPLGdCQUFnQjtJQU8zQjtRQUNFLEtBQUssQ0FBQyxRQUFRLENBQUMsR0FBRyxhQUFhLEVBQUUsZUFBZSxDQUFDLENBQUM7SUFDcEQsQ0FBQztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7SUFDekIsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELGVBQWU7UUFDYixNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQztRQUU1QywyREFBMkQ7UUFDM0QsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBRXBCLE1BQU0sTUFBTSxHQUF1QjtZQUNqQyxJQUFJLEVBQUUsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFpQjtZQUN4QyxJQUFJLEVBQUUsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFpQjtZQUN4QyxPQUFPLEVBQUU7Z0JBQ1AsR0FBRyxJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU87Z0JBQzNCLE9BQU8sRUFBRTtvQkFDUCxVQUFVLEVBQUU7d0JBQ1YsU0FBUyxFQUFFLENBQUMsS0FBSyxFQUFFLE9BQU8sRUFBRSxFQUFFOzRCQUM1QixNQUFNLElBQUksR0FBRyxPQUFPLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBZ0IsQ0FBQzs0QkFDN0QsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsRUFBRSxDQUFDLEdBQUcsR0FBRyxHQUFHLEVBQUUsQ0FBQyxDQUFDLENBQUM7NEJBQ3RELE1BQU0sVUFBVSxHQUFHLENBQUMsQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDLEdBQUcsR0FBRyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxHQUFHLEdBQUcsQ0FBQzs0QkFDNUQsT0FBTyxVQUFVLENBQUM7d0JBQ3BCLENBQUM7d0JBQ0QsS0FBSyxFQUFFLE1BQU07d0JBQ2IsSUFBSSxFQUFFOzRCQUNKLE1BQU0sRUFBRSxNQUFNO3lCQUNmO3FCQUNGO29CQUNELEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxPQUFPLEVBQUUsT0FBTztpQkFDckM7YUFDRjtTQUNGLENBQUM7UUFFRiw4QkFBOEI7UUFDOUIsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLEtBQUssQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDLENBQUM7SUFDekMsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNmLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDO1lBRXhDLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxPQUFPLEVBQUUsQ0FBQztnQkFDN0IsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxPQUFPLENBQUM7WUFDaEQsQ0FBQztZQUVELElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxFQUFFLENBQUM7UUFDdEIsQ0FBQztJQUNILENBQUM7SUFFTyxZQUFZO1FBQ2xCLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQ2YsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNyQixJQUFJLENBQUMsS0FBSyxHQUFHLFNBQWdCLENBQUM7UUFDaEMsQ0FBQztJQUNILENBQUM7K0dBckVVLGdCQUFnQjttR0FBaEIsZ0JBQWdCLGdOQ3ZCN0IsMkdBR0E7OzRGRG9CYSxnQkFBZ0I7a0JBTDVCLFNBQVM7K0JBQ0UsVUFBVTt3REFLWCxXQUFXO3NCQUFuQixLQUFLO2dCQUVOLFNBQVM7c0JBRFIsU0FBUzt1QkFBQyxhQUFhLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgT25Jbml0LFxuICBPbkRlc3Ryb3ksXG4gIFZpZXdDaGlsZCxcbiAgRWxlbWVudFJlZixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1xuICBDaGFydCxcbiAgQ2hhcnRDb25maWd1cmF0aW9uLFxuICByZWdpc3RlcmFibGVzLFxuICBDaGFydFR5cGUsXG4gIENoYXJ0RGF0YSxcbn0gZnJvbSAnY2hhcnQuanMnO1xuaW1wb3J0IHsgQ2hhcnRDb25maWcgfSBmcm9tICcuLi9tb2RlbHMvY2hhcnQtY29uZmlnLm1vZGVsJztcbmltcG9ydCBDaGFydERhdGFMYWJlbHMgZnJvbSAnY2hhcnRqcy1wbHVnaW4tZGF0YWxhYmVscyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3B0LWNoYXJ0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL3B0LWNoYXJ0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcHQtY2hhcnQuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQVENoYXJ0Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuICBASW5wdXQoKSBjaGFydENvbmZpZyE6IENoYXJ0Q29uZmlnO1xuICBAVmlld0NoaWxkKCdjaGFydENhbnZhcycsIHsgc3RhdGljOiB0cnVlIH0pXG4gIGNhbnZhc1JlZiE6IEVsZW1lbnRSZWY8SFRNTENhbnZhc0VsZW1lbnQ+O1xuXG4gIHByaXZhdGUgY2hhcnQhOiBDaGFydDtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICBDaGFydC5yZWdpc3RlciguLi5yZWdpc3RlcmFibGVzLCBDaGFydERhdGFMYWJlbHMpO1xuICB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy5pbml0aWFsaXplQ2hhcnQoKTtcbiAgfVxuXG4gIG5nT25EZXN0cm95KCkge1xuICAgIHRoaXMuZGVzdHJveUNoYXJ0KCk7XG4gIH1cblxuICBpbml0aWFsaXplQ2hhcnQoKSB7XG4gICAgY29uc3QgY2FudmFzID0gdGhpcy5jYW52YXNSZWYubmF0aXZlRWxlbWVudDtcblxuICAgIC8vIERlc3Ryb3kgdGhlIGV4aXN0aW5nIGNoYXJ0IGluc3RhbmNlIGlmIGl0IGFscmVhZHkgZXhpc3RzXG4gICAgdGhpcy5kZXN0cm95Q2hhcnQoKTtcblxuICAgIGNvbnN0IGNvbmZpZzogQ2hhcnRDb25maWd1cmF0aW9uID0ge1xuICAgICAgdHlwZTogdGhpcy5jaGFydENvbmZpZy50eXBlIGFzIENoYXJ0VHlwZSxcbiAgICAgIGRhdGE6IHRoaXMuY2hhcnRDb25maWcuZGF0YSBhcyBDaGFydERhdGEsXG4gICAgICBvcHRpb25zOiB7XG4gICAgICAgIC4uLnRoaXMuY2hhcnRDb25maWcub3B0aW9ucyxcbiAgICAgICAgcGx1Z2luczoge1xuICAgICAgICAgIGRhdGFsYWJlbHM6IHtcbiAgICAgICAgICAgIGZvcm1hdHRlcjogKHZhbHVlLCBjb250ZXh0KSA9PiB7XG4gICAgICAgICAgICAgIGNvbnN0IGRhdGEgPSBjb250ZXh0LmNoYXJ0LmRhdGEuZGF0YXNldHNbMF0uZGF0YSBhcyBudW1iZXJbXTtcbiAgICAgICAgICAgICAgY29uc3QgdG90YWwgPSBkYXRhLnJlZHVjZSgoc3VtLCB2YWwpID0+IHN1bSArIHZhbCwgMCk7XG4gICAgICAgICAgICAgIGNvbnN0IHBlcmNlbnRhZ2UgPSAoKHZhbHVlIC8gdG90YWwpICogMTAwKS50b0ZpeGVkKDEpICsgJyUnO1xuICAgICAgICAgICAgICByZXR1cm4gcGVyY2VudGFnZTtcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgICBjb2xvcjogJyMwMDAnLFxuICAgICAgICAgICAgZm9udDoge1xuICAgICAgICAgICAgICB3ZWlnaHQ6ICdib2xkJyxcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgfSxcbiAgICAgICAgICAuLi50aGlzLmNoYXJ0Q29uZmlnLm9wdGlvbnM/LnBsdWdpbnMsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH07XG5cbiAgICAvLyBDcmVhdGUgYSBuZXcgQ2hhcnQgaW5zdGFuY2VcbiAgICB0aGlzLmNoYXJ0ID0gbmV3IENoYXJ0KGNhbnZhcywgY29uZmlnKTtcbiAgfVxuXG4gIHVwZGF0ZUNoYXJ0KCkge1xuICAgIGlmICh0aGlzLmNoYXJ0KSB7XG4gICAgICB0aGlzLmNoYXJ0LmRhdGEgPSB0aGlzLmNoYXJ0Q29uZmlnLmRhdGE7XG5cbiAgICAgIGlmICh0aGlzLmNoYXJ0Q29uZmlnLm9wdGlvbnMpIHtcbiAgICAgICAgdGhpcy5jaGFydC5vcHRpb25zID0gdGhpcy5jaGFydENvbmZpZy5vcHRpb25zO1xuICAgICAgfVxuXG4gICAgICB0aGlzLmNoYXJ0LnVwZGF0ZSgpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgZGVzdHJveUNoYXJ0KCkge1xuICAgIGlmICh0aGlzLmNoYXJ0KSB7XG4gICAgICB0aGlzLmNoYXJ0LmRlc3Ryb3koKTtcbiAgICAgIHRoaXMuY2hhcnQgPSB1bmRlZmluZWQgYXMgYW55O1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdiBzdHlsZT1cInBvc2l0aW9uOiByZWxhdGl2ZTsgaGVpZ2h0OiAxMDAlOyB3aWR0aDogMTAwJVwiPlxuICA8Y2FudmFzICNjaGFydENhbnZhcz48L2NhbnZhcz5cbjwvZGl2PlxuIl19