diff --git a/src/app/components/dialog-edit-param-values/dialog-edit-param-values.component.ts b/src/app/components/dialog-edit-param-values/dialog-edit-param-values.component.ts index 436c323e2c580740f9a857d8a77532ec36ff496e..651702a5d2ecf95e1eb03d448383234fd224565b 100644 --- a/src/app/components/dialog-edit-param-values/dialog-edit-param-values.component.ts +++ b/src/app/components/dialog-edit-param-values/dialog-edit-param-values.component.ts @@ -147,9 +147,7 @@ export class DialogEditParamValuesComponent implements OnInit { */ private validateValuesListString(list: string) { let message: string; - // 1. validate against general pattern. Should not be necessary since "validate" button is disabled - // if pattern is not matched, BUT, HTML5 "pattern" behaves weirdly and accepts multiple decimal - // separators, like "3.3.4" :/ + // 1. validate against general pattern let ok = new RegExp(this.valuesListPattern).test(list); if (ok) { diff --git a/src/app/components/remous-results/remous-results.component.ts b/src/app/components/remous-results/remous-results.component.ts index a6ff0306bc8d9a38c3033a6867a7f595b320085c..a64d46ce41d264b9370a6654be5d667281a374fc 100644 --- a/src/app/components/remous-results/remous-results.component.ts +++ b/src/app/components/remous-results/remous-results.component.ts @@ -253,8 +253,10 @@ export class RemousResultsComponent implements DoCheck { @ViewChild(LogComponent) private logComponent: LogComponent; - constructor(private intlService: I18nService) { - } + constructor( + private intlService: I18nService, + private appSetup: ApplicationSetupService + ) { } private get uitextLigneFluviale() { return this.intlService.getExtraResLabel("FLU"); @@ -554,6 +556,7 @@ export class RemousResultsComponent implements DoCheck { this.graph1_data = gr1.data; + const nDigits = this.appSetup.displayDigits; this.graph1_options = { responsive: true, maintainAspectRatio: true, @@ -568,6 +571,26 @@ export class RemousResultsComponent implements DoCheck { display: true, text: this.uitextAbscisse, position: "bottom" + }, + scales: { + xAxes: [{ + gridLines: { + offsetGridLines: true + }, + ticks: { + precision: nDigits, + callback: function(value, index, values) { + return Number(value).toFixed(nDigits); + } + } + }] + }, + tooltips: { + callbacks: { + label: function(tooltipItem, data) { + return Number(tooltipItem.yLabel).toFixed(nDigits); + } + } } }; diff --git a/src/app/components/results-graph/results-graph.component.ts b/src/app/components/results-graph/results-graph.component.ts index 6e58fab42136faecc71cc324a91375e1ae998439..35dbf11cda534be7b9733acd4538dec58c29c931 100644 --- a/src/app/components/results-graph/results-graph.component.ts +++ b/src/app/components/results-graph/results-graph.component.ts @@ -38,7 +38,10 @@ export class ResultsGraphComponent implements AfterContentInit, Observer { public constructor( private appSetup: ApplicationSetupService - ) { } + ) { + // limit display precision according to app preferences + const nDigits = this.appSetup.displayDigits; + } public set results(r: VarResults) { this._results = r; @@ -74,15 +77,13 @@ export class ResultsGraphComponent implements AfterContentInit, Observer { * génère les données d'un graphe de type "line" */ private generateLineGraph() { - const nDigits = this.appSetup.displayDigits; const labs = []; const dat = []; let i = 0; for (const x of this._results.variatedParameter.valuesIterator) { - labs.push(x.toFixed(nDigits)); - + labs.push(x); const y = this._results.yValues[i]; - dat.push(y.toFixed(nDigits)); + dat.push(y); i++; } @@ -90,12 +91,10 @@ export class ResultsGraphComponent implements AfterContentInit, Observer { this.graph_data = { labels: labs, - datasets: [ - { - label: "", - data: dat - } - ] + datasets: [{ + label: "", + data: dat + }] }; } @@ -103,36 +102,45 @@ export class ResultsGraphComponent implements AfterContentInit, Observer { * génère les données d'un graphe de type "bar" */ private generateBarGraph() { - const nDigits = this.appSetup.displayDigits; const labs = []; const dat = []; let i = 0; for (const x of this._results.variatedParameter.valuesIterator) { - labs.push(x.toFixed(nDigits)); - + labs.push(x); const y = this._results.yValues[i]; - dat.push(y.toFixed(nDigits)); - + dat.push(y); i++; } this.graph_options.title.text = this._results.graphTitle; + const nDigits = this.appSetup.displayDigits; this.graph_options["scales"] = { xAxes: [{ gridLines: { offsetGridLines: true + }, + ticks: { + precision: nDigits, + callback: function(value, index, values) { + return Number(value).toFixed(nDigits); + } } }] }; + this.graph_options["tooltips"] = { + callbacks: { + label: function(tooltipItem, data) { + return Number(tooltipItem.yLabel).toFixed(nDigits); + } + } + }; this.graph_data = { labels: labs, - datasets: [ - { - label: "", - data: dat - } - ] + datasets: [{ + label: "", + data: dat + }] }; } @@ -140,40 +148,51 @@ export class ResultsGraphComponent implements AfterContentInit, Observer { * génère les données d'un graphe de type "scatter" */ private generateScatterGraph() { - const nDigits = this.appSetup.displayDigits; const dat = []; let i = 0; for (const x of this._results.variatedParameter.valuesIterator) { const y = this._results.yValues[i]; dat.push({ - x: x.toFixed(nDigits), - y: y.toFixed(nDigits) + x: x, + y: y }); i++; } this.graph_options.title.text = this._results.graphTitle; + const nDigits = this.appSetup.displayDigits; this.graph_options["scales"] = { xAxes: [{ type: "linear", - position: "bottom" + position: "bottom", + ticks: { + precision: nDigits + } }], yAxes: [{ type: "linear", - position: "left" + position: "left", + ticks: { + precision: nDigits + } }] }; + this.graph_options["tooltips"] = { + callbacks: { + label: function(tooltipItem, data) { + return "(" + Number(tooltipItem.xLabel).toFixed(nDigits) + ", " + Number(tooltipItem.yLabel).toFixed(nDigits) + ")"; + } + } + }; this.graph_data = { - datasets: [ - { - label: "", - data: dat, - borderColor: "#808080", // couleur de la ligne - backgroundColor: "rgba(0,0,0,0)", // couleur de remplissage sous la courbe : transparent - showLine: "true" - } - ] + datasets: [{ + label: "", + data: dat, + borderColor: "#808080", // couleur de la ligne + backgroundColor: "rgba(0,0,0,0)", // couleur de remplissage sous la courbe : transparent + showLine: "true" + }] }; }