@visionaris-bruno/vs-echarts 8.4.1 → 8.5.1

package/fesm2022/visionaris-bruno-vs-echarts.mjs

@@ -4,12 +4,13 @@ import { BarChart, PieChart, LineChart, ScatterChart, FunnelChart, SunburstChart
 import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, GraphicComponent, ToolboxComponent, PolarComponent, DatasetComponent, DataZoomComponent } from 'echarts/components';
 import { CanvasRenderer, SVGRenderer } from 'echarts/renderers';
 import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, ViewChild, Directive, Component } from '@angular/core';
+import { EventEmitter, Output, Input, ViewChild, Directive, inject, Component } from '@angular/core';
 import { ReplaySubject } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
 import merge from 'lodash/merge';
 import { CommonModule } from '@angular/common';
 import { merge as merge$1 } from 'lodash';
+import { TranslateService } from '@ngx-translate/core';
 
 /**
  * Global Design Tokens for ECharts
@@ -933,6 +934,7 @@ class RingBuilder {
 
 class BoxPlotBuilder {
     baseProduct;
+    translateService;
     valueFormatter = (value, key) => value.toLocaleString();
     palette = [];
     // TODO: Hay que implementar un valor por defecto.
@@ -940,25 +942,24 @@ class BoxPlotBuilder {
     result = {};
     constructor(baseProduct) {
         this.baseProduct = baseProduct;
+        try {
+            this.translateService = inject(TranslateService);
+        }
+        catch {
+            // Ignored if called outside an injection context (e.g. unit tests)
+        }
     }
     reset() {
         this.result = {};
     }
     addDataset(data, opts) {
-        const statisticKeys = {
-            min: 'Min',
-            q1: 'Q1',
-            median: 'Median',
-            q3: 'Q3',
-            max: 'Max',
-        };
         /**
          *
          * @param arr
          * @param statisticsKeys etiquetas personalizadas para los valores de estadistica.
          * @returns
          */
-        function calcularResumen5Numeros(arr, statisticsKeys) {
+        function calcularResumen5Numeros(arr) {
             if (arr.length === 0)
                 return null;
             // 1. Ordenar los números de menor a mayor
@@ -976,11 +977,11 @@ class BoxPlotBuilder {
                 }
             };
             return {
-                [statisticsKeys.min]: ordenados[0],
-                [statisticsKeys.q1]: obtenerPercentil(0.25),
-                [statisticsKeys.median]: obtenerPercentil(0.50),
-                [statisticsKeys.q3]: obtenerPercentil(0.75),
-                [statisticsKeys.max]: ordenados[ordenados.length - 1],
+                min: ordenados[0],
+                q1: obtenerPercentil(0.25),
+                median: obtenerPercentil(0.50),
+                q3: obtenerPercentil(0.75),
+                max: ordenados[ordenados.length - 1],
             };
         }
         ;
@@ -990,7 +991,7 @@ class BoxPlotBuilder {
                 .filter(([key, val]) => key !== 'category' && !isNaN(val))
                 .map(([_, val]) => Number(val));
             // resumen5NumerosXCat
-            const resObj = Object.assign({ category: s.category }, calcularResumen5Numeros(values, statisticKeys));
+            const resObj = Object.assign({ category: s.category }, calcularResumen5Numeros(values));
             return resObj;
         });
         const dataset = [{
@@ -1032,17 +1033,31 @@ class BoxPlotBuilder {
     addTooltip(data, overrides) {
         const mainMeassureKey = data.dimensions.filter(d => d.name != 'category')[0].name;
         const valueFormatter = this.valueFormatter;
+        const translate = (key, fallback) => {
+            if (!this.translateService)
+                return fallback;
+            const res = this.translateService.instant(key);
+            return res === key ? fallback : res;
+        };
+        const labelMap = {
+            min: translate('VS_ECHARTS.BOXPLOT.MIN', 'Min'),
+            q1: translate('VS_ECHARTS.BOXPLOT.Q1', 'Q1'),
+            median: translate('VS_ECHARTS.BOXPLOT.MEDIAN', 'Median'),
+            q3: translate('VS_ECHARTS.BOXPLOT.Q3', 'Q3'),
+            max: translate('VS_ECHARTS.BOXPLOT.MAX', 'Max'),
+        };
         function tooltipFormatter(params) {
             const tooltipEventData = Array.isArray(params) ? params[0] : params;
             const title = `<b>${tooltipEventData.name}</b></br>`;
             let htmlbody = ``;
             for (const datakey in tooltipEventData.data) {
-                const label = datakey;
+                const rawLabel = datakey;
                 const value = tooltipEventData.data[datakey];
-                if (label == 'category') {
+                if (rawLabel == 'category') {
                     continue;
                 }
                 ;
+                const label = labelMap[rawLabel] || rawLabel;
                 const formattedValue = valueFormatter(value, mainMeassureKey);
                 const bodyText = `${tooltipEventData.marker}${label}: ${formattedValue}</br>`;
                 htmlbody += bodyText;
@@ -1313,7 +1328,7 @@ class VSECDirector {
         const { valueFormatter = undefined, palette = undefined, colorResolver = undefined, axisTypes = {
             x: 'value',
             y: 'category',
-        }, statisticsKeys = undefined, } = opts;
+        }, } = opts;
         this.builder.reset();
         // El orden importa, primero callbacks y despues componentes.
         this.builder.setValueFormatter(valueFormatter);
@@ -1324,7 +1339,7 @@ class VSECDirector {
         // chart components
         this.builder.addCommons();
         const layoutOpts = { axisTypes };
-        this.builder.addDataset(data, { statisticsKeys });
+        this.builder.addDataset(data);
         this.builder.addSeries(data, seriesOverrides, layoutOpts);
         this.builder.addXAxis(data, overrides.axis, axisTypes.x);
         this.builder.addYAxis(data, overrides.axis, axisTypes.y);