@esfaenza/es-charts 11.2.15 → 11.2.19

package/bundles/esfaenza-es-charts.umd.js

@@ -1173,6 +1173,11 @@
              * Evento lanciato al termine del caricamento di una nuova pagina del grafico
              */
             this.onLoadEnd = new core.EventEmitter();
+            /**
+            * Evento lanciato al termine della creazione del grafico referenziando l'istanza nativa del grafico creato in modo da poter effettuare modifiche
+            * post inizializzazione lato applicativo
+            */
+            this.chartLoaded = new core.EventEmitter();
             /**
              * Serve a decidere se sarà presente l'interfaccia di paginazione
              */
@@ -1264,7 +1269,7 @@
                     _this.Chart = _this.ChartService.ChartInstance;
                     if (!_this.Chart)
                         _this.log("Chart " + _this.name + ": Could not create graph");
-                    return _this.Charter.applyLocale(_this.Chart, _this.Locale).then(function () { return _this.initDone = true; });
+                    return _this.Charter.applyLocale(_this.Chart, _this.Locale).then(function () { _this.initDone = true; _this.chartLoaded.emit(_this.Chart); });
                 })
             ]);
         };
@@ -1366,6 +1371,13 @@
             });
             this.Dispatcher.register(this.name, function () { return _this.loadChart(); });
         };
+        /**
+         * Permette di aggiungere un blocco di dati in maniera "live" ad un grafico
+         */
+        BaseChartComponent.prototype.addData = function (chartData) {
+            this.ChartService.refreshData(chartData);
+        };
+        ;
         /**
          * Funzione che si occupa di caricare i temi necessari per il grafico in oggetto. Prima applica il tema, poi, se serve, applica le animazioni
          */
@@ -1434,7 +1446,8 @@
         onSelectionChanged: [{ type: core.Output }],
         onSeriesClicked: [{ type: core.Output }],
         onLoadStart: [{ type: core.Output }],
-        onLoadEnd: [{ type: core.Output }]
+        onLoadEnd: [{ type: core.Output }],
+        chartLoaded: [{ type: core.Output }]
     };
 
     /**
@@ -1449,6 +1462,8 @@
             this.DataGroupBucketSize = 1500;
             /** @ignore */
             this.OpacityOnSelected = 0.3;
+            /** @ignore */
+            this.singleDataSet = false;
             //******************** Funzione di throttling per non spammare richieste in caso di animazioni attivate
             //TODO: spostarla in un metodo di utilità (esfaenza/extensions)
             /** @ignore */
@@ -1462,7 +1477,7 @@
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
             var dataConverted = this.Adapter ? this.Adapter.adaptDataForLineChart(data) : data;
             var threshold = (_a = settings.DataGroupingThreshold) !== null && _a !== void 0 ? _a : 3000;
-            var singleDataSet = (_b = settings.MergeDatasets) !== null && _b !== void 0 ? _b : false;
+            this.singleDataSet = (_b = settings.MergeDatasets) !== null && _b !== void 0 ? _b : false;
             var showTicks = settings.ShowTicks == null ? true : settings === null || settings === void 0 ? void 0 : settings.ShowTicks;
             var dataShouldBeGrouped = Math.max.apply(Math, __spread(dataConverted.series.map(function (t) { return t.values.length; }))) > threshold;
             var showTimeline = settings.Timeline || dataShouldBeGrouped;
@@ -1491,6 +1506,7 @@
                     range.label.text = dataConverted.limit.upperLabel;
                     range.label.fill = range.grid.stroke;
                     range.label.verticalCenter = "bottom";
+                    range.label.stroke = am4core__namespace.color(dataConverted.limit.upperColor || "#F92200");
                     range.grid.stroke = am4core__namespace.color(dataConverted.limit.upperColor || "#F92200");
                     range.grid.strokeWidth = 2;
                     range.grid.strokeOpacity = 1;
@@ -1502,6 +1518,7 @@
                     range.label.text = dataConverted.limit.lowerLabel;
                     range.label.fill = range.grid.stroke;
                     range.label.verticalCenter = "bottom";
+                    range.label.stroke = am4core__namespace.color(dataConverted.limit.lowerColor || "#F92200");
                     range.grid.stroke = am4core__namespace.color(dataConverted.limit.lowerColor || "#F92200");
                     range.grid.strokeWidth = 2;
                     range.grid.strokeOpacity = 1;
@@ -1539,31 +1556,9 @@
             var seriesColors = [];
             var defaultIndex = 0;
             //-- Generazione di un unico dataset invece che N, per poter gestire un unico tooltip
-            if (singleDataSet) {
-                var dto_1 = {};
-                dataConverted.series.forEach(function (vs, index) {
-                    for (var i = 0; i < vs.values.length; i++) {
-                        var dataitem = vs.values[i];
-                        var indexer = new Date(dataitem.d).valueOf();
-                        if (!dto_1[indexer])
-                            dto_1[indexer] = {};
-                        dto_1[indexer]['v' + index] = dataitem.v;
-                    }
-                });
-                var dates = Object.keys(dto_1);
-                var singleDS = [];
-                for (var i = 0; i < dates.length; i++) {
-                    var values = dto_1[dates[i]];
-                    var item = { d: new Date(parseInt(dates[i])) };
-                    var vals = Object.keys(values);
-                    for (var ii = 0; ii < vals.length; ii++) {
-                        var series = vals[ii];
-                        var singleVal = values[series];
-                        item[series] = singleVal;
-                    }
-                    singleDS.push(item);
-                }
-                this.ChartInstance.data = singleDS;
+            if (this.singleDataSet) {
+                this.ChartInstance.data = this.generateSingleDataset(dataConverted);
+                ;
                 dateAxis.cursorTooltipEnabled = false;
             }
             //-- Fine generazione
@@ -1587,14 +1582,14 @@
                     s.values.sort(function (d1, d2) { return d1.d.getTime() - d2.d.getTime(); });
                 var fill = s.fill != null && s.fill != undefined ? s.fill : ((_a = settings === null || settings === void 0 ? void 0 : settings.Fill) !== null && _a !== void 0 ? _a : false);
                 var series = (settings === null || settings === void 0 ? void 0 : settings.Step) ? new am4charts__namespace.StepLineSeries() : new am4charts__namespace.LineSeries();
-                series.dataFields.valueY = "v" + (singleDataSet ? index : "");
+                series.dataFields.valueY = "v" + (_this.singleDataSet ? index : "");
                 series.dataFields.dateX = "d";
                 series.dataFields.measureUnit = s.uom;
                 series.name = s.name;
                 series.strokeWidth = (_b = settings === null || settings === void 0 ? void 0 : settings.StrokeSize) !== null && _b !== void 0 ? _b : 1;
                 series.connect = !gapsAllowed;
                 series.minBulletDistance = 10;
-                series.tooltipText = singleDataSet ? "" : "{name}: [bold]{valueY}[/]";
+                series.tooltipText = _this.singleDataSet ? "" : "{name}: [bold]{valueY}[/]";
                 series.tooltip.pointerOrientation = "vertical";
                 series.tooltip.background.fillOpacity = 0.5;
                 series.tooltip.label.padding(12, 12, 12, 12);
@@ -1602,7 +1597,7 @@
                 series.stacked = fill;
                 //Dataset singolo, i dati sono registrati a livello di chart, creo il tooltip che permette di vederli tutti insieme
                 //altrimenti assegno i dati della serie direttamente alla serie
-                if (singleDataSet) {
+                if (_this.singleDataSet) {
                     series.tooltip.getFillFromObject = false;
                     series.tooltip.background.fill = am4core__namespace.color("#eee");
                     series.tooltip.label.fill = am4core__namespace.color("#00");
@@ -1692,7 +1687,7 @@
             //******************************************************************************************************************************
             this.ChartInstance.cursor.xAxis = dateAxis;
             this.ChartInstance.cursor.yAxis = yAxis;
-            if (singleDataSet)
+            if (this.singleDataSet)
                 this.ChartInstance.cursor.maxTooltipDistance = -1;
             //TODO: Cercare di capire perché è figlio di puttana......
             dateAxis.events.on("startchanged", function (t) { return _this.emitSelectionChanged(t, settings); });
@@ -1701,7 +1696,59 @@
         };
         /** @ignore */
         LineChartService.prototype.refreshData = function (data) {
-            //TODO:IMPL
+            var dataConverted = this.Adapter ? this.Adapter.adaptDataForLineChart(data) : data;
+            if (this.singleDataSet) {
+                var data = this.generateSingleDataset(dataConverted);
+                this.ChartInstance.addData(data);
+                return;
+            }
+            this.ChartInstance.series.each(function (s) {
+                var relativeSerie = dataConverted.series.find(function (t) { return t.name == s.name; });
+                // Una serie del grafico è stata ggiornata, ordino i datapoint e li aggiungo
+                var correctOrder = true;
+                var prevDate = null;
+                for (var v = 0; v < relativeSerie.values.length; v++) {
+                    if (!prevDate)
+                        prevDate = relativeSerie.values[v].d;
+                    else if (relativeSerie.values[v].d < prevDate) {
+                        correctOrder = false;
+                        break;
+                    }
+                }
+                if (!correctOrder)
+                    relativeSerie.values.sort(function (d1, d2) { return d1.d.getTime() - d2.d.getTime(); });
+                for (var v = 0; v < relativeSerie.values.length; v++) {
+                    var obj = relativeSerie.values[v];
+                    s.addData({ date: obj.d, value: obj.v });
+                }
+            });
+        };
+        /** Partendo da dati divisi per seriue genera un dataset unito con la data come chiave e i vari valori dopo */
+        LineChartService.prototype.generateSingleDataset = function (data) {
+            var dto = {};
+            data.series.forEach(function (vs, index) {
+                for (var i = 0; i < vs.values.length; i++) {
+                    var dataitem = vs.values[i];
+                    var indexer = new Date(dataitem.d).valueOf();
+                    if (!dto[indexer])
+                        dto[indexer] = {};
+                    dto[indexer]['v' + index] = dataitem.v;
+                }
+            });
+            var dates = Object.keys(dto);
+            var ret = [];
+            for (var i = 0; i < dates.length; i++) {
+                var values = dto[dates[i]];
+                var item = { d: new Date(parseInt(dates[i])) };
+                var vals = Object.keys(values);
+                for (var ii = 0; ii < vals.length; ii++) {
+                    var series = vals[ii];
+                    var singleVal = values[series];
+                    item[series] = singleVal;
+                }
+                ret.push(item);
+            }
+            return ret;
         };
         /** @ignore */
         LineChartService.prototype.emitSelectionChanged = function (ev, settings) {