@esfaenza/es-charts 11.2.11 → 11.2.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/esfaenza-es-charts.umd.js +70 -21
- package/bundles/esfaenza-es-charts.umd.js.map +1 -1
- package/bundles/esfaenza-es-charts.umd.min.js +1 -1
- package/bundles/esfaenza-es-charts.umd.min.js.map +1 -1
- package/esfaenza-es-charts.metadata.json +1 -1
- package/esm2015/lib/models/data/classes/LineChartData.js +4 -2
- package/esm2015/lib/models/data/classes/base/Limit.js +15 -0
- package/esm2015/lib/models/data/classes/base/LineSerie.js +5 -3
- package/esm2015/lib/models/data/index.js +2 -1
- package/esm2015/lib/services/classes/LineChartService.js +46 -18
- package/esm2015/public-api.js +2 -1
- package/fesm2015/esfaenza-es-charts.js +68 -21
- package/fesm2015/esfaenza-es-charts.js.map +1 -1
- package/lib/models/data/classes/LineChartData.d.ts +4 -1
- package/lib/models/data/classes/base/Limit.d.ts +13 -0
- package/lib/models/data/classes/base/LineSerie.d.ts +4 -2
- package/lib/models/data/index.d.ts +1 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -84,10 +84,12 @@
|
|
|
84
84
|
* Costruttore
|
|
85
85
|
*
|
|
86
86
|
* @param {LineSerie[]} series Lista di serie da graficare
|
|
87
|
+
* @param {{upper: lower}}
|
|
87
88
|
*/
|
|
88
|
-
function LineChartData(series) {
|
|
89
|
+
function LineChartData(series, limit) {
|
|
89
90
|
if (series === void 0) { series = []; }
|
|
90
91
|
this.series = series;
|
|
92
|
+
this.limit = limit;
|
|
91
93
|
}
|
|
92
94
|
return LineChartData;
|
|
93
95
|
}());
|
|
@@ -593,6 +595,22 @@
|
|
|
593
595
|
return LegendPad;
|
|
594
596
|
}());
|
|
595
597
|
|
|
598
|
+
/**
|
|
599
|
+
* Modello che identifica un limite superiore - inferiore
|
|
600
|
+
*/
|
|
601
|
+
var Limit = /** @class */ (function () {
|
|
602
|
+
/** @ignore */
|
|
603
|
+
function Limit(upper, upperLabel, upperColor, lower, lowerLabel, lowerColor) {
|
|
604
|
+
this.upper = upper;
|
|
605
|
+
this.upperLabel = upperLabel;
|
|
606
|
+
this.upperColor = upperColor;
|
|
607
|
+
this.lower = lower;
|
|
608
|
+
this.lowerLabel = lowerLabel;
|
|
609
|
+
this.lowerColor = lowerColor;
|
|
610
|
+
}
|
|
611
|
+
return Limit;
|
|
612
|
+
}());
|
|
613
|
+
|
|
596
614
|
/**
|
|
597
615
|
* Modello che identifica la coppia Data-Valore
|
|
598
616
|
*/
|
|
@@ -640,15 +658,17 @@
|
|
|
640
658
|
* @param {string} name Nome della serie
|
|
641
659
|
* @param {DateValue[]} values Valori della serie
|
|
642
660
|
* @param {BaseInterval} interval Intervallo della serie. Viene utilizzato per gestire Gap e date in Istante Finale
|
|
643
|
-
* @param {string} color Colore della serie, verrà usato sia per la
|
|
661
|
+
* @param {string} color Colore della serie, verrà usato sia per la linea base che eventualmente per il riempimento (in caso si utilizzi l'Input **Fill** nel grafico)
|
|
644
662
|
* @param {string} uom Unità di misura da presentare nell'asse delle Y
|
|
663
|
+
* @param {boolean} fill Override della proprietà **Fill** del grafico, specifico per ogni serie
|
|
645
664
|
*/
|
|
646
|
-
function LineSerie(name, values, interval, color, uom) {
|
|
665
|
+
function LineSerie(name, values, interval, color, uom, fill) {
|
|
647
666
|
this.name = name;
|
|
648
667
|
this.values = values;
|
|
649
668
|
this.interval = interval;
|
|
650
669
|
this.color = color;
|
|
651
670
|
this.uom = uom;
|
|
671
|
+
this.fill = fill;
|
|
652
672
|
}
|
|
653
673
|
return LineSerie;
|
|
654
674
|
}());
|
|
@@ -1439,7 +1459,7 @@
|
|
|
1439
1459
|
*/
|
|
1440
1460
|
LineChartService.prototype.graphicate = function (data, settings) {
|
|
1441
1461
|
var _this = this;
|
|
1442
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
1462
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
1443
1463
|
var dataConverted = this.Adapter ? this.Adapter.adaptDataForLineChart(data) : data;
|
|
1444
1464
|
var threshold = (_a = settings.DataGroupingThreshold) !== null && _a !== void 0 ? _a : 3000;
|
|
1445
1465
|
var singleDataSet = (_b = settings.MergeDatasets) !== null && _b !== void 0 ? _b : false;
|
|
@@ -1450,7 +1470,6 @@
|
|
|
1450
1470
|
var interval = seriesWithInterval ? dataConverted.series.find(function (t) { return t.interval; }).interval : null;
|
|
1451
1471
|
var gapsAllowed = (settings === null || settings === void 0 ? void 0 : settings.AllowGaps) == null ? seriesWithInterval : settings === null || settings === void 0 ? void 0 : settings.AllowGaps;
|
|
1452
1472
|
var finalInstant = (_c = settings === null || settings === void 0 ? void 0 : settings.FinalInstants) !== null && _c !== void 0 ? _c : true;
|
|
1453
|
-
var fill = (_d = settings === null || settings === void 0 ? void 0 : settings.Fill) !== null && _d !== void 0 ? _d : false;
|
|
1454
1473
|
//Per evitare di dimenticarmeli e gestire comunque bene gli ngif ecc...
|
|
1455
1474
|
am4core__namespace.options.autoDispose = true;
|
|
1456
1475
|
this.ChartInstance = am4core__namespace.create(settings.Name, am4charts__namespace.XYChart);
|
|
@@ -1464,6 +1483,30 @@
|
|
|
1464
1483
|
yAxis.min = settings.Min;
|
|
1465
1484
|
if (settings.Max)
|
|
1466
1485
|
yAxis.max = settings.Max;
|
|
1486
|
+
if (dataConverted.limit) {
|
|
1487
|
+
if (dataConverted.limit.upper != null && dataConverted.limit.upper != undefined) {
|
|
1488
|
+
var range = yAxis.axisRanges.create();
|
|
1489
|
+
range.value = dataConverted.limit.upper;
|
|
1490
|
+
range.label.inside = true;
|
|
1491
|
+
range.label.text = dataConverted.limit.upperLabel;
|
|
1492
|
+
range.label.fill = range.grid.stroke;
|
|
1493
|
+
range.label.verticalCenter = "bottom";
|
|
1494
|
+
range.grid.stroke = am4core__namespace.color(dataConverted.limit.upperColor || "#F92200");
|
|
1495
|
+
range.grid.strokeWidth = 2;
|
|
1496
|
+
range.grid.strokeOpacity = 1;
|
|
1497
|
+
}
|
|
1498
|
+
if (dataConverted.limit.lower != null && dataConverted.limit.lower != undefined) {
|
|
1499
|
+
var range = yAxis.axisRanges.create();
|
|
1500
|
+
range.value = dataConverted.limit.lower;
|
|
1501
|
+
range.label.inside = true;
|
|
1502
|
+
range.label.text = dataConverted.limit.lowerLabel;
|
|
1503
|
+
range.label.fill = range.grid.stroke;
|
|
1504
|
+
range.label.verticalCenter = "bottom";
|
|
1505
|
+
range.grid.stroke = am4core__namespace.color(dataConverted.limit.lowerColor || "#F92200");
|
|
1506
|
+
range.grid.strokeWidth = 2;
|
|
1507
|
+
range.grid.strokeOpacity = 1;
|
|
1508
|
+
}
|
|
1509
|
+
}
|
|
1467
1510
|
var dateAxis = ChartInstanceCasted.xAxes.push(new am4charts__namespace.DateAxis());
|
|
1468
1511
|
if (settings.XAxisTitle) {
|
|
1469
1512
|
dateAxis.title.text = settings.XAxisTitle;
|
|
@@ -1477,11 +1520,11 @@
|
|
|
1477
1520
|
dateAxis.renderer.ticks.template.length = 10;
|
|
1478
1521
|
dateAxis.renderer.ticks.template.location = 0;
|
|
1479
1522
|
}
|
|
1480
|
-
dateAxis.renderer.minGridDistance = (
|
|
1523
|
+
dateAxis.renderer.minGridDistance = (_d = settings === null || settings === void 0 ? void 0 : settings.MinGridDistance) !== null && _d !== void 0 ? _d : 50;
|
|
1481
1524
|
dateAxis.renderer.grid.template.location = 0;
|
|
1482
1525
|
dateAxis.minZoomCount = 5;
|
|
1483
1526
|
dateAxis.groupData = dataShouldBeGrouped;
|
|
1484
|
-
dateAxis.groupCount = (
|
|
1527
|
+
dateAxis.groupCount = (_e = settings.DataGroupBucketSize) !== null && _e !== void 0 ? _e : this.DataGroupBucketSize;
|
|
1485
1528
|
//Se ho almeno una serie ad intervallo e i settings non mi impediscono esplicitamente di usare i gaps, visualizzo i dati col gap
|
|
1486
1529
|
if (gapsAllowed) {
|
|
1487
1530
|
if (!seriesWithInterval) {
|
|
@@ -1525,7 +1568,7 @@
|
|
|
1525
1568
|
}
|
|
1526
1569
|
//-- Fine generazione
|
|
1527
1570
|
dataConverted.series.forEach(function (s, index) {
|
|
1528
|
-
var _a, _b;
|
|
1571
|
+
var _a, _b, _c;
|
|
1529
1572
|
if (s.values[0] && !(s.values[0].d instanceof Date)) {
|
|
1530
1573
|
for (var v = 0; v < s.values.length; v++)
|
|
1531
1574
|
s.values[v].d = new Date(s.values[v].d);
|
|
@@ -1542,12 +1585,13 @@
|
|
|
1542
1585
|
}
|
|
1543
1586
|
if (!correctOrder)
|
|
1544
1587
|
s.values.sort(function (d1, d2) { return d1.d.getTime() - d2.d.getTime(); });
|
|
1588
|
+
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);
|
|
1545
1589
|
var series = (settings === null || settings === void 0 ? void 0 : settings.Step) ? new am4charts__namespace.StepLineSeries() : new am4charts__namespace.LineSeries();
|
|
1546
1590
|
series.dataFields.valueY = "v" + (singleDataSet ? index : "");
|
|
1547
1591
|
series.dataFields.dateX = "d";
|
|
1548
1592
|
series.dataFields.measureUnit = s.uom;
|
|
1549
1593
|
series.name = s.name;
|
|
1550
|
-
series.strokeWidth = (
|
|
1594
|
+
series.strokeWidth = (_b = settings === null || settings === void 0 ? void 0 : settings.StrokeSize) !== null && _b !== void 0 ? _b : 1;
|
|
1551
1595
|
series.connect = !gapsAllowed;
|
|
1552
1596
|
series.minBulletDistance = 10;
|
|
1553
1597
|
series.tooltipText = singleDataSet ? "" : "{name}: [bold]{valueY}[/]";
|
|
@@ -1598,7 +1642,7 @@
|
|
|
1598
1642
|
series.data = s.values;
|
|
1599
1643
|
var segment = series.segments.template;
|
|
1600
1644
|
var hoverState = segment.states.create("hover");
|
|
1601
|
-
hoverState.properties.strokeWidth = ((
|
|
1645
|
+
hoverState.properties.strokeWidth = ((_c = settings === null || settings === void 0 ? void 0 : settings.StrokeSize) !== null && _c !== void 0 ? _c : 1) + 1;
|
|
1602
1646
|
var dimmed = segment.states.create("dimmed");
|
|
1603
1647
|
dimmed.properties.stroke = am4core__namespace.color("#dadada");
|
|
1604
1648
|
//Se la serie ha un colore, uso quello, altrimenti pesco dai colori di default andando in ordine
|
|
@@ -1619,17 +1663,17 @@
|
|
|
1619
1663
|
});
|
|
1620
1664
|
if (settings.Legend) {
|
|
1621
1665
|
this.ChartInstance.legend = new am4charts__namespace.Legend();
|
|
1622
|
-
this.ChartInstance.legend.position = (
|
|
1666
|
+
this.ChartInstance.legend.position = (_f = settings === null || settings === void 0 ? void 0 : settings.LegendPosition) !== null && _f !== void 0 ? _f : 'right';
|
|
1623
1667
|
this.ChartInstance.legend.scrollable = true;
|
|
1624
1668
|
this.ChartInstance.legend.itemContainers.template.tooltipText = "{name}";
|
|
1625
|
-
this.ChartInstance.legend.itemContainers.template.events.on("over", function (event) { _this.processOver(event.target.dataItem.dataContext
|
|
1626
|
-
this.ChartInstance.legend.itemContainers.template.events.on("out", function (
|
|
1669
|
+
this.ChartInstance.legend.itemContainers.template.events.on("over", function (event) { _this.processOver(event.target.dataItem.dataContext); });
|
|
1670
|
+
this.ChartInstance.legend.itemContainers.template.events.on("out", function () { _this.processOut(); });
|
|
1627
1671
|
if (settings.LegendPadding) {
|
|
1628
1672
|
var template = this.ChartInstance.legend.itemContainers.template;
|
|
1629
|
-
template.paddingTop = (
|
|
1630
|
-
template.paddingBottom = (
|
|
1631
|
-
template.paddingLeft = (
|
|
1632
|
-
template.paddingRight = (
|
|
1673
|
+
template.paddingTop = (_g = settings.LegendPadding.top) !== null && _g !== void 0 ? _g : 0;
|
|
1674
|
+
template.paddingBottom = (_h = settings.LegendPadding.bottom) !== null && _h !== void 0 ? _h : 0;
|
|
1675
|
+
template.paddingLeft = (_j = settings.LegendPadding.left) !== null && _j !== void 0 ? _j : 0;
|
|
1676
|
+
template.paddingRight = (_k = settings.LegendPadding.right) !== null && _k !== void 0 ? _k : 0;
|
|
1633
1677
|
}
|
|
1634
1678
|
}
|
|
1635
1679
|
this.ChartInstance.cursor = new am4charts__namespace.XYCursor();
|
|
@@ -1672,9 +1716,10 @@
|
|
|
1672
1716
|
}
|
|
1673
1717
|
};
|
|
1674
1718
|
/** @ignore */
|
|
1675
|
-
LineChartService.prototype.processOver = function (hoveredSeries
|
|
1719
|
+
LineChartService.prototype.processOver = function (hoveredSeries) {
|
|
1676
1720
|
var _this = this;
|
|
1677
1721
|
hoveredSeries.toFront();
|
|
1722
|
+
var fill = hoveredSeries.stacked;
|
|
1678
1723
|
hoveredSeries.segments.each(function (segment) {
|
|
1679
1724
|
segment.setState("hover");
|
|
1680
1725
|
if (!fill)
|
|
@@ -1683,17 +1728,20 @@
|
|
|
1683
1728
|
if (!fill)
|
|
1684
1729
|
hoveredSeries.legendDataItem.marker.children.getIndex(1).fillOpacity = this.OpacityOnSelected;
|
|
1685
1730
|
this.ChartInstance.series.each(function (series) {
|
|
1686
|
-
if (series != hoveredSeries)
|
|
1731
|
+
if (series != hoveredSeries) {
|
|
1732
|
+
var fill_1 = series.stacked;
|
|
1687
1733
|
series.segments.each(function (segment) {
|
|
1688
1734
|
segment.setState("dimmed");
|
|
1689
|
-
if (!
|
|
1735
|
+
if (!fill_1)
|
|
1690
1736
|
segment.fillSprite.fillOpacity = 0;
|
|
1691
1737
|
});
|
|
1738
|
+
}
|
|
1692
1739
|
});
|
|
1693
1740
|
};
|
|
1694
1741
|
/** @ignore */
|
|
1695
|
-
LineChartService.prototype.processOut = function (
|
|
1742
|
+
LineChartService.prototype.processOut = function () {
|
|
1696
1743
|
this.ChartInstance.series.each(function (series) {
|
|
1744
|
+
var fill = series.stacked;
|
|
1697
1745
|
series.segments.each(function (segment) {
|
|
1698
1746
|
segment.setState("default");
|
|
1699
1747
|
if (!fill)
|
|
@@ -3127,6 +3175,7 @@
|
|
|
3127
3175
|
exports.KeyValue = KeyValue;
|
|
3128
3176
|
exports.KeyValueColor = KeyValueColor;
|
|
3129
3177
|
exports.LegendPad = LegendPad;
|
|
3178
|
+
exports.Limit = Limit;
|
|
3130
3179
|
exports.LineChartData = LineChartData;
|
|
3131
3180
|
exports.LineChartSettings = LineChartSettings;
|
|
3132
3181
|
exports.LineSerie = LineSerie;
|