Commit 9f0a1365 authored by Jenkins's avatar Jenkins
Browse files

Merge commit '0d9bcc41'

parents e9bc223c 0d9bcc41
......@@ -11,7 +11,7 @@ import {
ViewEncapsulation
} from '@angular/core';
import { forkJoin, Subscription } from 'rxjs';
import Chart from 'chart.js/auto';
import Chart, {FontSpec} from 'chart.js/auto';
import ChartDataLabels from 'chartjs-plugin-datalabels';
@Component({
......@@ -41,10 +41,11 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
color: '#FFF',
anchor: 'center',
align: 'end',
offset: 4,
clamp: true,
formatter: (value) => this.formatDataLabel(value),
font: {
weight: 'bold',
size: 16
}
};
......@@ -59,7 +60,8 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
@Input() withAnimation = true;
@Input() legendClass: string = null;
@Input() withValueOnChart = false;
@Input() fontStyle: string;
@Input() font: FontSpec = {family: 'Roboto, sans-serif', size: 16};
@Input() locale: string = null;
protected htmlLegendPlugin = {
id: 'htmlLegend',
......@@ -140,6 +142,18 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
};
ngOnInit(): void {
// TODO: utilisation d'un service pour construire les différent type de graphs
Chart.defaults.font = Object.assign(Chart.defaults.font, this.font);
Chart.defaults.set('plugins.datalabels', {
font: Chart.defaults.font
});
if ( this.locale) {
Chart.defaults.locale = this.locale;
}
if (!this.colors || !(this.colors instanceof Array) || this.colors.length === 0) {
this.colors = this.colorDefault;
}
......@@ -203,6 +217,7 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
}
}
});
this.colors = newColor;
return retour;
}
......@@ -229,20 +244,33 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
const dataSets = this.buildDataSet(this.datas);
this.labelOnChartParam.align = 'end';
this.labelOnChartParam.anchor = 'center';
this.labelOnChartParam.anchor = 'end';
this.labelOnChartParam.offset = -6;
this.labelOnChartParam.color = 'black';
this.labelOnChartParam.font.weight = 'normal';
const maxY = this.calculAxeX();
const chartRef = new Chart(ctx2d, {
plugins: [ChartDataLabels, this.htmlLegendPlugin],
type: 'bar',
data: {
labels: [''],
datasets: dataSets
},
options: {
scales: {
y: {
max: maxY,
ticks: {
// forces step size to be 50 units
stepSize: Math.ceil(maxY / 3)
}
},
},
animation: this.withAnimation,
indexAxis: 'x',
maintainAspectRatio: false,
......@@ -273,13 +301,6 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
const labels = Object.keys(dataFilter);
const values = Object.values(dataFilter);
// TODO: utilisation d'un service pour construire les différent type de graphs
Chart.defaults.font.size = 16;
if (this.fontStyle){
Chart.defaults.font.family = 'Roboto, sans-serif';
}
const chatRef = new Chart(ctx2d, {
plugins: [ChartDataLabels],
type: 'pie',
......@@ -329,10 +350,26 @@ export class ChartComponent implements OnInit, AfterViewInit, OnDestroy {
return listContainer;
}
capitalizeFirstLetter(text: string): string {
protected capitalizeFirstLetter(text: string): string {
return text.charAt(0).toUpperCase() + text.toLowerCase().slice(1);
}
/**
*
* Calcul d'une marge pour l'axe X supérieur de 10% par rapport à la valeur max de chartData
* @protected
*/
protected calculAxeX(): number{
const max = Math.max(...Object.values(this.chartData));
return ( Math.ceil( ( max * 0.1 ) ) + max);
}
protected formatDataLabel(value: number){
console.log(value, value.toLocaleString(Chart.defaults.locale), this.locale, Chart.defaults.locale );
return value.toLocaleString(Chart.defaults.locale);
}
ngOnDestroy(): void {
if (this.querySubscription) {
this.querySubscription.unsubscribe();
......
import { Pipe, PipeTransform } from '@angular/core';
import {toFixed} from 'ol/math';
@Pipe({
name: 'informationSheetFilter'
......@@ -16,9 +15,13 @@ export class InformationSheetFilterPipe implements PipeTransform {
} else if (value === true || value === false) {
return value ? 'Oui' : 'Non';
} else if (isFinite(value as number)) {
if (typeof value === 'string'){
value = parseFloat(value);
}
if (digit || digit === 0) {
value = toFixed(value as number, digit);
value = parseFloat( (value).toFixed(digit));
}
return value.toLocaleString(local);
} else {
return value;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment