@tetacom/svg-charts 1.2.16 → 1.2.19
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/esm2020/chart/chart-container/annotation/annotation.component.mjs +5 -5
- package/esm2020/chart/chart-container/chart-container.component.mjs +5 -5
- package/esm2020/chart/chart-container/plotband/plot-band.component.mjs +3 -3
- package/esm2020/chart/chart-container/series/area-series/area-series.component.mjs +6 -3
- package/esm2020/chart/chart-container/series/bar/bar-series.component.mjs +6 -6
- package/esm2020/chart/chart-container/series/block-area-series/block-area-series.component.mjs +5 -5
- package/esm2020/chart/chart-container/series/block-series/block-series.component.mjs +7 -8
- package/esm2020/chart/chart-container/series/linear-series-base.mjs +6 -3
- package/esm2020/chart/chart-container/series/scatter-series/scatter-series.component.mjs +5 -5
- package/esm2020/chart/legend/legend.component.mjs +3 -3
- package/fesm2015/tetacom-svg-charts.mjs +44 -34
- package/fesm2015/tetacom-svg-charts.mjs.map +1 -1
- package/fesm2020/tetacom-svg-charts.mjs +39 -34
- package/fesm2020/tetacom-svg-charts.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -23,14 +23,14 @@ export class LegendComponent {
|
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
25
|
LegendComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: LegendComponent, deps: [{ token: i1.ChartService }], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
-
LegendComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: LegendComponent, selector: "teta-legend", inputs: { series: "series" }, host: { properties: { "class.padding-bottom-4": "this.classLegend" } }, ngImport: i0, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"
|
|
26
|
+
LegendComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: LegendComponent, selector: "teta-legend", inputs: { series: "series" }, host: { properties: { "class.padding-bottom-4": "this.classLegend" } }, ngImport: i0, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"\n [style.height.px]=\"getHeight(serie)\"\n [style.border-top-color]=\"serie.visible ? serie.color : 'var(--color-text-30)'\"\n [style.border-top-style]=\"serie.style?.strokeDasharray ? 'dashed' : 'solid'\"\n [style.border-width.px]=\"serie.style?.strokeDasharray ? 1 : 2\"></div>\n <div class=\"legend-label\" style=\"user-select: none\" [style.text-decoration]=\"serie.visible ? 'none' : 'line-through'\">{{ serie.name }}</div>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:flex;grid-gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-evenly}:host .legend-item{display:flex;align-items:center}:host .legend-icon-form{width:12px}:host .legend-label{margin-left:5px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
27
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: LegendComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
|
-
args: [{ selector: 'teta-legend', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"
|
|
29
|
+
args: [{ selector: 'teta-legend', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"\n [style.height.px]=\"getHeight(serie)\"\n [style.border-top-color]=\"serie.visible ? serie.color : 'var(--color-text-30)'\"\n [style.border-top-style]=\"serie.style?.strokeDasharray ? 'dashed' : 'solid'\"\n [style.border-width.px]=\"serie.style?.strokeDasharray ? 1 : 2\"></div>\n <div class=\"legend-label\" style=\"user-select: none\" [style.text-decoration]=\"serie.visible ? 'none' : 'line-through'\">{{ serie.name }}</div>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:flex;grid-gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-evenly}:host .legend-item{display:flex;align-items:center}:host .legend-icon-form{width:12px}:host .legend-label{margin-left:5px}\n"] }]
|
|
30
30
|
}], ctorParameters: function () { return [{ type: i1.ChartService }]; }, propDecorators: { series: [{
|
|
31
31
|
type: Input
|
|
32
32
|
}], classLegend: [{
|
|
33
33
|
type: HostBinding,
|
|
34
34
|
args: ['class.padding-bottom-4']
|
|
35
35
|
}] } });
|
|
36
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
36
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGVnZW5kLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jaGFydC9sZWdlbmQvbGVnZW5kLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uL3NyYy9jaGFydC9sZWdlbmQvbGVnZW5kLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFdBQVcsRUFDWCxLQUFLLEdBQ04sTUFBTSxlQUFlLENBQUM7QUFHdkIsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLDJCQUEyQixDQUFDOzs7O0FBU3ZELE1BQU0sT0FBTyxlQUFlO0lBWTFCLFlBQW9CLFlBQTBCO1FBQTFCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBWHRDLGdCQUFXLEdBQUcsSUFBSSxHQUFHLEVBQXNCO2FBQ2hELEdBQUcsQ0FBQyxVQUFVLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQzthQUN2QixHQUFHLENBQUMsVUFBVSxDQUFDLE9BQU8sRUFBRSxFQUFFLENBQUM7YUFDM0IsR0FBRyxDQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUUsRUFBRSxDQUFDO2FBQ3ZCLEdBQUcsQ0FBQyxVQUFVLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQzthQUN2QixHQUFHLENBQUMsVUFBVSxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUM7YUFDekIsR0FBRyxDQUFDLFVBQVUsQ0FBQyxTQUFTLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFHTyxnQkFBVyxHQUFHLElBQUksQ0FBQztJQUVULENBQUM7SUFFbEQsU0FBUyxDQUFDLEtBQXdCO1FBQ2hDLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLElBQUksSUFBSSxVQUFVLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDN0QsQ0FBQztJQUVELEtBQUssQ0FBQyxLQUF3QjtRQUM3QixJQUFJLENBQUMsWUFBWSxDQUFDLHNCQUFzQixDQUFDLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUM7SUFDdEQsQ0FBQzs7NEdBcEJVLGVBQWU7Z0dBQWYsZUFBZSx5SkNqQjVCLDh1QkFZQTsyRkRLYSxlQUFlO2tCQU4zQixTQUFTOytCQUNFLGFBQWEsbUJBR04sdUJBQXVCLENBQUMsTUFBTTttR0FXdEMsTUFBTTtzQkFBZCxLQUFLO2dCQUNpQyxXQUFXO3NCQUFqRCxXQUFXO3VCQUFDLHdCQUF3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEhvc3RCaW5kaW5nLFxuICBJbnB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTZXJpZXMgfSBmcm9tICcuLi9tb2RlbC9zZXJpZXMnO1xuaW1wb3J0IHsgQmFzZVBvaW50IH0gZnJvbSAnLi4vbW9kZWwvYmFzZS1wb2ludCc7XG5pbXBvcnQgeyBTZXJpZXNUeXBlIH0gZnJvbSAnLi4vbW9kZWwvZW51bS9zZXJpZXMtdHlwZSc7XG5pbXBvcnQge0NoYXJ0U2VydmljZX0gZnJvbSBcIi4uL3NlcnZpY2UvY2hhcnQuc2VydmljZVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd0ZXRhLWxlZ2VuZCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9sZWdlbmQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9sZWdlbmQuY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIExlZ2VuZENvbXBvbmVudCB7XG4gIHByaXZhdGUgc2l6ZU1hcHBpbmcgPSBuZXcgTWFwPFNlcmllc1R5cGUsIG51bWJlcj4oKVxuICAgIC5zZXQoU2VyaWVzVHlwZS5saW5lLCAyKVxuICAgIC5zZXQoU2VyaWVzVHlwZS5zY2F0dGVyLCAxMilcbiAgICAuc2V0KFNlcmllc1R5cGUuYmFyLCAxMilcbiAgICAuc2V0KFNlcmllc1R5cGUuYXJlYSwgMilcbiAgICAuc2V0KFNlcmllc1R5cGUuYmxvY2ssIDEyKVxuICAgIC5zZXQoU2VyaWVzVHlwZS5ibG9ja0FyZWEsIDIpO1xuXG4gIEBJbnB1dCgpIHNlcmllczogQXJyYXk8U2VyaWVzPEJhc2VQb2ludD4+O1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLnBhZGRpbmctYm90dG9tLTQnKSBjbGFzc0xlZ2VuZCA9IHRydWU7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBjaGFydFNlcnZpY2U6IENoYXJ0U2VydmljZSkge31cblxuICBnZXRIZWlnaHQoc2VyaWU6IFNlcmllczxCYXNlUG9pbnQ+KSB7XG4gICAgcmV0dXJuIHRoaXMuc2l6ZU1hcHBpbmcuZ2V0KHNlcmllLnR5cGUgPz8gU2VyaWVzVHlwZS5saW5lKTtcbiAgfVxuXG4gIGNsaWNrKHNlcmllOiBTZXJpZXM8QmFzZVBvaW50Pikge1xuICAgdGhpcy5jaGFydFNlcnZpY2UudG9nZ2xlVmlzaWJpbGl0eVNlcmllcyhbc2VyaWUuaWRdKTtcbiAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgc2VyaWUgb2Ygc2VyaWVzXCIgY2xhc3M9XCJwYWRkaW5nLWJvdHRvbS00XCI+XG4gIDxkaXYgKm5nSWY9XCJzZXJpZT8uc2hvd0luTGVnZW5kICE9PSBmYWxzZVwiPlxuICAgIDxkaXYgY2xhc3M9XCJsZWdlbmQtaXRlbSBjdXJzb3ItcG9pbnRlclwiIChjbGljayk9XCJjbGljayhzZXJpZSlcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJsZWdlbmQtaWNvbi1mb3JtXCJcbiAgICAgICAgICAgW3N0eWxlLmhlaWdodC5weF09XCJnZXRIZWlnaHQoc2VyaWUpXCJcbiAgICAgICAgICAgW3N0eWxlLmJvcmRlci10b3AtY29sb3JdPVwic2VyaWUudmlzaWJsZSA/IHNlcmllLmNvbG9yIDogJ3ZhcigtLWNvbG9yLXRleHQtMzApJ1wiXG4gICAgICAgICAgIFtzdHlsZS5ib3JkZXItdG9wLXN0eWxlXT1cInNlcmllLnN0eWxlPy5zdHJva2VEYXNoYXJyYXkgPyAnZGFzaGVkJyA6ICdzb2xpZCdcIlxuICAgICAgICAgICBbc3R5bGUuYm9yZGVyLXdpZHRoLnB4XT1cInNlcmllLnN0eWxlPy5zdHJva2VEYXNoYXJyYXkgPyAxIDogMlwiPjwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cImxlZ2VuZC1sYWJlbFwiIHN0eWxlPVwidXNlci1zZWxlY3Q6IG5vbmVcIiBbc3R5bGUudGV4dC1kZWNvcmF0aW9uXT1cInNlcmllLnZpc2libGUgPyAnbm9uZScgOiAnbGluZS10aHJvdWdoJ1wiPnt7IHNlcmllLm5hbWUgfX08L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L25nLWNvbnRhaW5lcj5cbiJdfQ==
|
|
@@ -1060,9 +1060,13 @@ class LinearSeriesBase extends SeriesBaseComponent {
|
|
|
1060
1060
|
return this.getTransform(event, x.get(this.series.xAxisIndex).scale, y.get(this.series.yAxisIndex).scale);
|
|
1061
1061
|
}), tap(() => setTimeout(() => this.cdr.detectChanges())));
|
|
1062
1062
|
this.path = this.scaleService.scales.pipe(map((data) => {
|
|
1063
|
+
var _a, _b;
|
|
1063
1064
|
const { x, y } = data;
|
|
1064
|
-
this.x = x.get(this.series.xAxisIndex).scale;
|
|
1065
|
-
this.y = y.get(this.series.yAxisIndex).scale;
|
|
1065
|
+
this.x = (_a = x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
1066
|
+
this.y = (_b = y.get(this.series.yAxisIndex)) === null || _b === void 0 ? void 0 : _b.scale;
|
|
1067
|
+
if (!this.x || !this.y) {
|
|
1068
|
+
return '';
|
|
1069
|
+
}
|
|
1066
1070
|
const filter = this.defaultClipPointsMapping.get(this.series.clipPointsDirection);
|
|
1067
1071
|
const line = d3
|
|
1068
1072
|
.line()
|
|
@@ -1273,7 +1277,8 @@ class BarSeriesComponent extends SeriesBaseComponent {
|
|
|
1273
1277
|
return count.length;
|
|
1274
1278
|
}));
|
|
1275
1279
|
this.x1 = this.scaleService.scales.pipe(map((_) => {
|
|
1276
|
-
|
|
1280
|
+
var _a;
|
|
1281
|
+
const x = (_a = _.x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
1277
1282
|
const range = x.range();
|
|
1278
1283
|
const domain = this.series.data.map((_) => _.x);
|
|
1279
1284
|
return d3
|
|
@@ -1282,8 +1287,8 @@ class BarSeriesComponent extends SeriesBaseComponent {
|
|
|
1282
1287
|
.domain(domain)
|
|
1283
1288
|
.padding(0.1);
|
|
1284
1289
|
}));
|
|
1285
|
-
this.x = this.scaleService.scales.pipe(map((_) => _.x.get(this.series.xAxisIndex).scale));
|
|
1286
|
-
this.y = this.scaleService.scales.pipe(map((_) => _.y.get(this.series.yAxisIndex).scale));
|
|
1290
|
+
this.x = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1291
|
+
this.y = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.y.get(this.series.yAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1287
1292
|
}
|
|
1288
1293
|
mouseenter(point) {
|
|
1289
1294
|
this.svc.setTooltip({
|
|
@@ -1300,10 +1305,10 @@ class BarSeriesComponent extends SeriesBaseComponent {
|
|
|
1300
1305
|
ngOnChanges(changes) { }
|
|
1301
1306
|
}
|
|
1302
1307
|
BarSeriesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BarSeriesComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ScaleService }, { token: ZoomService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1303
|
-
BarSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BarSeriesComponent, selector: "svg:svg[teta-bar-series]", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n x: x | async,\n x1: x1 | async,\n y: y | async,\n barSeriesCount: barSeriesCount | async\n} as data\">\n <ng-container *ngIf=\"data.barSeriesCount > 1\">\n
|
|
1308
|
+
BarSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BarSeriesComponent, selector: "svg:svg[teta-bar-series]", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n x: x | async,\n x1: x1 | async,\n y: y | async,\n barSeriesCount: barSeriesCount | async\n} as data\">\n <ng-container *ngIf=\"data.x && data.y\">\n <ng-container *ngIf=\"data.barSeriesCount > 1\">\n <svg:rect\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.x]=\"data.x(point.x) + (series.id * data.x1.bandwidth() / data.barSeriesCount)\"\n [attr.y]=\"point.y > 0 ? data.y(point.y) : data.y(0)\"\n [attr.width]=\"data.x1.bandwidth() / data.barSeriesCount\"\n [attr.height]=\"Math.abs(data.y(point.y) - data.y(0))\"\n [attr.fill]=\"series.color\"\n ></svg:rect>\n </ng-container>\n <ng-container *ngIf=\"data.barSeriesCount === 1\">\n <svg:rect\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.x]=\"data.x(point.x)\"\n [attr.y]=\"point.y > 0 ? data.y(point.y) : data.y(0)\"\n [attr.width]=\"data.x1.bandwidth()\"\n [attr.height]=\"Math.abs(data.y(point.y) - data.y(0))\"\n [attr.fill]=\"point.color ?? series.color\"\n ></svg:rect>\n </ng-container>\n </ng-container>\n</ng-container>\n\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1304
1309
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BarSeriesComponent, decorators: [{
|
|
1305
1310
|
type: Component,
|
|
1306
|
-
args: [{ selector: 'svg:svg[teta-bar-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n x: x | async,\n x1: x1 | async,\n y: y | async,\n barSeriesCount: barSeriesCount | async\n} as data\">\n <ng-container *ngIf=\"data.barSeriesCount > 1\">\n
|
|
1311
|
+
args: [{ selector: 'svg:svg[teta-bar-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n x: x | async,\n x1: x1 | async,\n y: y | async,\n barSeriesCount: barSeriesCount | async\n} as data\">\n <ng-container *ngIf=\"data.x && data.y\">\n <ng-container *ngIf=\"data.barSeriesCount > 1\">\n <svg:rect\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.x]=\"data.x(point.x) + (series.id * data.x1.bandwidth() / data.barSeriesCount)\"\n [attr.y]=\"point.y > 0 ? data.y(point.y) : data.y(0)\"\n [attr.width]=\"data.x1.bandwidth() / data.barSeriesCount\"\n [attr.height]=\"Math.abs(data.y(point.y) - data.y(0))\"\n [attr.fill]=\"series.color\"\n ></svg:rect>\n </ng-container>\n <ng-container *ngIf=\"data.barSeriesCount === 1\">\n <svg:rect\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.x]=\"data.x(point.x)\"\n [attr.y]=\"point.y > 0 ? data.y(point.y) : data.y(0)\"\n [attr.width]=\"data.x1.bandwidth()\"\n [attr.height]=\"Math.abs(data.y(point.y) - data.y(0))\"\n [attr.fill]=\"point.color ?? series.color\"\n ></svg:rect>\n </ng-container>\n </ng-container>\n</ng-container>\n\n" }]
|
|
1307
1312
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ScaleService }, { type: ZoomService }, { type: i0.ElementRef }]; } });
|
|
1308
1313
|
|
|
1309
1314
|
class ScatterSeriesComponent extends SeriesBaseComponent {
|
|
@@ -1316,8 +1321,8 @@ class ScatterSeriesComponent extends SeriesBaseComponent {
|
|
|
1316
1321
|
this.element = element;
|
|
1317
1322
|
}
|
|
1318
1323
|
ngOnInit() {
|
|
1319
|
-
this.x = this.scaleService.scales.pipe(map(_ => _.x.get(this.series.xAxisIndex).scale));
|
|
1320
|
-
this.y = this.scaleService.scales.pipe(map(_ => _.y.get(this.series.yAxisIndex).scale));
|
|
1324
|
+
this.x = this.scaleService.scales.pipe(map(_ => { var _a; return (_a = _.x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1325
|
+
this.y = this.scaleService.scales.pipe(map(_ => { var _a; return (_a = _.y.get(this.series.yAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1321
1326
|
}
|
|
1322
1327
|
ngAfterViewInit() {
|
|
1323
1328
|
}
|
|
@@ -1335,10 +1340,10 @@ class ScatterSeriesComponent extends SeriesBaseComponent {
|
|
|
1335
1340
|
}
|
|
1336
1341
|
}
|
|
1337
1342
|
ScatterSeriesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ScatterSeriesComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ScaleService }, { token: ZoomService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1338
|
-
ScatterSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ScatterSeriesComponent, selector: "svg:svg[teta-scatter-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async\n} as scales\">\n <svg:circle\n
|
|
1343
|
+
ScatterSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ScatterSeriesComponent, selector: "svg:svg[teta-scatter-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async\n} as scales\">\n <ng-container *ngIf=\"scales.x && scales.y\">\n <svg:circle\n class=\"line\"\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.cx]=\"scales.x(point.x)\"\n [attr.cy]=\"scales.y(point.y)\"\n [attr.r]=\"series.style?.radius ?? 1\"\n [attr.stroke]=\"point.color ?? series.color\"\n [attr.fill]=\"point.color ?? series.color\"\n [attr.stroke-width]=\"series.style?.strokeWidth\">\n </svg:circle>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [".draggable-marker{cursor:move}.active{stroke-opacity:.5}.marker-grab{opacity:0}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1339
1344
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ScatterSeriesComponent, decorators: [{
|
|
1340
1345
|
type: Component,
|
|
1341
|
-
args: [{ selector: 'svg:svg[teta-scatter-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async\n} as scales\">\n <svg:circle\n
|
|
1346
|
+
args: [{ selector: 'svg:svg[teta-scatter-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async\n} as scales\">\n <ng-container *ngIf=\"scales.x && scales.y\">\n <svg:circle\n class=\"line\"\n *ngFor=\"let point of series.data\"\n (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\"\n [attr.cx]=\"scales.x(point.x)\"\n [attr.cy]=\"scales.y(point.y)\"\n [attr.r]=\"series.style?.radius ?? 1\"\n [attr.stroke]=\"point.color ?? series.color\"\n [attr.fill]=\"point.color ?? series.color\"\n [attr.stroke-width]=\"series.style?.strokeWidth\">\n </svg:circle>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [".draggable-marker{cursor:move}.active{stroke-opacity:.5}.marker-grab{opacity:0}\n"] }]
|
|
1342
1347
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ScaleService }, { type: ZoomService }, { type: i0.ElementRef }]; } });
|
|
1343
1348
|
|
|
1344
1349
|
class BlockSeriesComponent extends SeriesBaseComponent {
|
|
@@ -1354,10 +1359,9 @@ class BlockSeriesComponent extends SeriesBaseComponent {
|
|
|
1354
1359
|
this.id = (Date.now() + Math.random()).toString(36);
|
|
1355
1360
|
}
|
|
1356
1361
|
ngOnInit() {
|
|
1357
|
-
|
|
1358
|
-
this.
|
|
1359
|
-
this.
|
|
1360
|
-
this.displayPoints = this.y.pipe(map((y) => {
|
|
1362
|
+
this.x = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1363
|
+
this.y = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.y.get(this.series.yAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1364
|
+
this.displayPoints = this.y.pipe(filter((y) => y), map((y) => {
|
|
1361
1365
|
return this.series.data.filter((point, index, arr) => {
|
|
1362
1366
|
var _a, _b, _c, _d;
|
|
1363
1367
|
const [min, max] = y.domain();
|
|
@@ -1388,10 +1392,10 @@ class BlockSeriesComponent extends SeriesBaseComponent {
|
|
|
1388
1392
|
}
|
|
1389
1393
|
}
|
|
1390
1394
|
BlockSeriesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BlockSeriesComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ScaleService }, { token: ZoomService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1391
|
-
BlockSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BlockSeriesComponent, selector: "svg:svg[teta-block-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\" gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngFor=\"let point of data.points\">\n
|
|
1395
|
+
BlockSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BlockSeriesComponent, selector: "svg:svg[teta-block-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\" gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngIf=\"data.x && data.y\">\n <ng-container *ngFor=\"let point of data.points\">\n <svg:g (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\">\n <svg:rect\n x=\"0\"\n [attr.y]=\"data.y(point.y)\"\n [attr.height]=\"Math.abs(data.y(point.y1) - data.y(point.y))\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\"\n width=\"100%\">\n </svg:rect>\n <svg:text *ngIf=\"point.text && data.y(point.y1) - data.y(point.y) > 8\"\n x=\"50%\"\n [attr.y]=\"(data.y(point.y1) + data.y(point.y)) / 2\"\n alignment-baseline=\"middle\"\n text-anchor=\"middle\">{{ point.text }}\n </svg:text>\n <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y)\" [attr.y2]=\"data.y(point.y)\"\n [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>\n <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y1)\" [attr.y2]=\"data.y(point.y1)\"\n [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>\n </svg:g>\n </ng-container>\n\n </ng-container>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1392
1396
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BlockSeriesComponent, decorators: [{
|
|
1393
1397
|
type: Component,
|
|
1394
|
-
args: [{ selector: 'svg:svg[teta-block-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\" gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngFor=\"let point of data.points\">\n
|
|
1398
|
+
args: [{ selector: 'svg:svg[teta-block-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\" gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngIf=\"data.x && data.y\">\n <ng-container *ngFor=\"let point of data.points\">\n <svg:g (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\">\n <svg:rect\n x=\"0\"\n [attr.y]=\"data.y(point.y)\"\n [attr.height]=\"Math.abs(data.y(point.y1) - data.y(point.y))\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\"\n width=\"100%\">\n </svg:rect>\n <svg:text *ngIf=\"point.text && data.y(point.y1) - data.y(point.y) > 8\"\n x=\"50%\"\n [attr.y]=\"(data.y(point.y1) + data.y(point.y)) / 2\"\n alignment-baseline=\"middle\"\n text-anchor=\"middle\">{{ point.text }}\n </svg:text>\n <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y)\" [attr.y2]=\"data.y(point.y)\"\n [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>\n <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y1)\" [attr.y2]=\"data.y(point.y1)\"\n [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>\n </svg:g>\n </ng-container>\n\n </ng-container>\n</ng-container>\n" }]
|
|
1395
1399
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ScaleService }, { type: ZoomService }, { type: i0.ElementRef }]; } });
|
|
1396
1400
|
|
|
1397
1401
|
class BlockAreaSeriesComponent extends SeriesBaseComponent {
|
|
@@ -1409,7 +1413,7 @@ class BlockAreaSeriesComponent extends SeriesBaseComponent {
|
|
|
1409
1413
|
ngOnInit() {
|
|
1410
1414
|
this.x = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1411
1415
|
this.y = this.scaleService.scales.pipe(map((_) => { var _a; return (_a = _.y.get(this.series.yAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale; }));
|
|
1412
|
-
this.displayPoints = this.y.pipe(map((y) => {
|
|
1416
|
+
this.displayPoints = this.y.pipe(filter((y) => y), map((y) => {
|
|
1413
1417
|
return this.series.data.filter((point, index, arr) => {
|
|
1414
1418
|
var _a, _b, _c, _d;
|
|
1415
1419
|
const [min, max] = y.domain();
|
|
@@ -1440,10 +1444,10 @@ class BlockAreaSeriesComponent extends SeriesBaseComponent {
|
|
|
1440
1444
|
}
|
|
1441
1445
|
}
|
|
1442
1446
|
BlockAreaSeriesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BlockAreaSeriesComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ScaleService }, { token: ZoomService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1443
|
-
BlockAreaSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BlockAreaSeriesComponent, selector: "svg:svg[teta-block-area-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngFor=\"let point of data.points\">\n
|
|
1447
|
+
BlockAreaSeriesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: BlockAreaSeriesComponent, selector: "svg:svg[teta-block-area-series]", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngIf=\"data.x && data.y\">\n\n\n <ng-container *ngFor=\"let point of data.points\">\n <svg:g (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\">\n <svg:rect\n *ngIf=\"!!config.inverted\"\n [attr.x]=\"data.x(0) < data.x(point.x) ? data.x(0) : data.x(point.x)\"\n [attr.y]=\"data.y(point.y)\"\n [attr.height]=\"Math.abs(data.y(point.y1) - data.y(point.y))\"\n [attr.width]=\"data.x(0) < data.x(point.x) ? data.x(point.x) - data.x(0) : data.x(0) - data.x(point.x)\"\n [attr.stroke]=\"point.iconId ? '' : point.color ?? series.color\"\n [attr.stroke-dasharray]=\"series.style?.strokeDasharray\"\n [attr.stroke-width]=\"series.style?.strokeWidth\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\">\n </svg:rect>\n <svg:rect\n *ngIf=\"!config.inverted\"\n [attr.x]=\"data.x(point.x)\"\n [attr.y]=\"data.y(0)\"\n [attr.height]=\"Math.abs(data.y(0) - data.y(point.y))\"\n [attr.width]=\"data.x(point.x1) - data.x(point.x)\"\n [attr.stroke]=\"point.iconId ? '' : point.color ?? series.color\"\n [attr.stroke-dasharray]=\"series.style?.strokeDasharray\"\n [attr.stroke-width]=\"series.style?.strokeWidth\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\">\n </svg:rect>\n <svg:text *ngIf=\"point.text\"\n x=\"50%\"\n [attr.y]=\"(data.y(point.y1) + data.y(point.y)) / 2\"\n alignment-baseline=\"middle\"\n text-anchor=\"middle\">{{ point.text }}\n </svg:text>\n\n <!-- <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y)\" [attr.y2]=\"data.y(point.y)\" [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>-->\n <!-- <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y1)\" [attr.y2]=\"data.y(point.y1)\" [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>-->\n\n </svg:g>\n </ng-container>\n\n </ng-container>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1444
1448
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: BlockAreaSeriesComponent, decorators: [{
|
|
1445
1449
|
type: Component,
|
|
1446
|
-
args: [{ selector: 'svg:svg[teta-block-area-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngFor=\"let point of data.points\">\n
|
|
1450
|
+
args: [{ selector: 'svg:svg[teta-block-area-series]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n y: y | async,\n x: x | async,\n points: displayPoints | async\n} as data\">\n <svg:defs *ngIf=\"series?.fillType === fillType.gradient\">\n <svg:linearGradient [id]=\"'gradient-fill-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"0%\"\n [attr.y1]=\"config?.inverted ? '0%' : '100%'\"\n [attr.x2]=\"config?.inverted ? '100%' : '0%'\"\n y2=\"0%\">\n <svg:stop offset=\"0%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0\"></svg:stop>\n <svg:stop offset=\"5%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.1\"></svg:stop>\n <svg:stop offset=\"20%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.2\"></svg:stop>\n <svg:stop offset=\"60%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.5\"></svg:stop>\n <svg:stop offset=\"100%\" [attr.stop-color]=\"series.color\" stop-opacity=\"0.9\"></svg:stop>\n </svg:linearGradient>\n </svg:defs>\n <ng-container *ngIf=\"data.x && data.y\">\n\n\n <ng-container *ngFor=\"let point of data.points\">\n <svg:g (mouseenter)=\"mouseenter(point)\"\n (mouseleave)=\"mouseleave(point)\">\n <svg:rect\n *ngIf=\"!!config.inverted\"\n [attr.x]=\"data.x(0) < data.x(point.x) ? data.x(0) : data.x(point.x)\"\n [attr.y]=\"data.y(point.y)\"\n [attr.height]=\"Math.abs(data.y(point.y1) - data.y(point.y))\"\n [attr.width]=\"data.x(0) < data.x(point.x) ? data.x(point.x) - data.x(0) : data.x(0) - data.x(point.x)\"\n [attr.stroke]=\"point.iconId ? '' : point.color ?? series.color\"\n [attr.stroke-dasharray]=\"series.style?.strokeDasharray\"\n [attr.stroke-width]=\"series.style?.strokeWidth\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\">\n </svg:rect>\n <svg:rect\n *ngIf=\"!config.inverted\"\n [attr.x]=\"data.x(point.x)\"\n [attr.y]=\"data.y(0)\"\n [attr.height]=\"Math.abs(data.y(0) - data.y(point.y))\"\n [attr.width]=\"data.x(point.x1) - data.x(point.x)\"\n [attr.stroke]=\"point.iconId ? '' : point.color ?? series.color\"\n [attr.stroke-dasharray]=\"series.style?.strokeDasharray\"\n [attr.stroke-width]=\"series.style?.strokeWidth\"\n [attr.fill]=\"series.fillType === fillType.gradient ? 'url(#gradient-fill-'+id+')' : point.iconId ? 'url(#pattern'+point.iconId+')' : point.color ?? series.color\"\n [attr.fill-opacity]=\"series.style?.fillOpacity\">\n </svg:rect>\n <svg:text *ngIf=\"point.text\"\n x=\"50%\"\n [attr.y]=\"(data.y(point.y1) + data.y(point.y)) / 2\"\n alignment-baseline=\"middle\"\n text-anchor=\"middle\">{{ point.text }}\n </svg:text>\n\n <!-- <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y)\" [attr.y2]=\"data.y(point.y)\" [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>-->\n <!-- <svg:line x1=\"0\" x2=\"100%\" [attr.y1]=\"data.y(point.y1)\" [attr.y2]=\"data.y(point.y1)\" [attr.stroke]=\"point.iconId ? 'var(--color-text-10)' : point.color ?? series.color\"></svg:line>-->\n\n </svg:g>\n </ng-container>\n\n </ng-container>\n</ng-container>\n" }]
|
|
1447
1451
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ScaleService }, { type: ZoomService }, { type: i0.ElementRef }]; } });
|
|
1448
1452
|
|
|
1449
1453
|
class AreaSeriesComponent extends LinearSeriesBase {
|
|
@@ -1461,9 +1465,13 @@ class AreaSeriesComponent extends LinearSeriesBase {
|
|
|
1461
1465
|
ngOnInit() {
|
|
1462
1466
|
super.ngOnInit();
|
|
1463
1467
|
this.areaPath = this.scaleService.scales.pipe(map((data) => {
|
|
1468
|
+
var _a, _b;
|
|
1464
1469
|
const { x, y } = data;
|
|
1465
|
-
this.x = x.get(this.series.xAxisIndex).scale;
|
|
1466
|
-
this.y = y.get(this.series.yAxisIndex).scale;
|
|
1470
|
+
this.x = (_a = x.get(this.series.xAxisIndex)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
1471
|
+
this.y = (_b = y.get(this.series.yAxisIndex)) === null || _b === void 0 ? void 0 : _b.scale;
|
|
1472
|
+
if (!this.x || !this.y) {
|
|
1473
|
+
return '';
|
|
1474
|
+
}
|
|
1467
1475
|
const area = d3
|
|
1468
1476
|
.area()
|
|
1469
1477
|
.defined((point) => point.x !== null &&
|
|
@@ -1847,10 +1855,10 @@ class PlotBandComponent {
|
|
|
1847
1855
|
}
|
|
1848
1856
|
}
|
|
1849
1857
|
PlotBandComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PlotBandComponent, deps: [{ token: ScaleService }, { token: ZoomService }, { token: ChartService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1850
|
-
PlotBandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PlotBandComponent, selector: "[teta-plot-band]", inputs: { plotBand: "plotBand", axis: "axis", scale: "scale", size: "size" }, host: { listeners: { "click": "click($event)", "contextmenu": "contextMenu($event)" } }, ngImport: i0, template: "<svg:rect\n class=\"plotband\" xmlns:svg=\"http://www.w3.org/1999/html\"\n [class.draggable]=\"plotBand?.draggable === true\"\n [attr.fill]=\"getFill(plotBand)\"\n [attr.opacity]=\"plotBand.style?.plotBand?.opacity\"\n [attr.height]=\"axis.orientation === orientation.x ? height : bandSize\"\n [attr.width]=\"axis.orientation === orientation.x ? bandSize : width\"\n [attr.y]=\"axis.orientation === orientation.y ? from : null\"\n [attr.x]=\"axis.orientation === orientation.x ? from : null\">\n</svg:rect>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.x\"\n text-anchor=\"middle\"\n dominant-baseline=\"central\"\n class=\"label font-
|
|
1858
|
+
PlotBandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PlotBandComponent, selector: "[teta-plot-band]", inputs: { plotBand: "plotBand", axis: "axis", scale: "scale", size: "size" }, host: { listeners: { "click": "click($event)", "contextmenu": "contextMenu($event)" } }, ngImport: i0, template: "<svg:rect\n class=\"plotband\" xmlns:svg=\"http://www.w3.org/1999/html\"\n [class.draggable]=\"plotBand?.draggable === true\"\n [attr.fill]=\"getFill(plotBand)\"\n [attr.opacity]=\"plotBand.style?.plotBand?.opacity\"\n [attr.height]=\"axis.orientation === orientation.x ? height : bandSize\"\n [attr.width]=\"axis.orientation === orientation.x ? bandSize : width\"\n [attr.y]=\"axis.orientation === orientation.y ? from : null\"\n [attr.x]=\"axis.orientation === orientation.x ? from : null\">\n</svg:rect>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.x\"\n text-anchor=\"middle\"\n dominant-baseline=\"central\"\n class=\"label font-caption fill-text-90\"\n [attr.x]=\"getTextCenter()\"\n [attr.transform]=\"'rotate(-90, '+ getTextCenter() +',' + height / 2 + ')'\"\n [attr.y]=\"height / 2\">{{plotBand.label}}\n</svg:text>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.y\"\n text-anchor=\"middle\"\n class=\"label font-caption fill-text-90\"\n dominant-baseline=\"central\"\n [attr.x]=\"getTextCenter()\"\n [attr.y]=\"width / 2\">{{plotBand.label}}\n</svg:text>\n\n<svg:line class=\"display-grabber\"\n *ngIf=\"plotBand.showGrabbers && plotBand.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"plotBand.style?.grabbers?.strokeWidth || 4\"\n [attr.stroke-dasharray]=\"plotBand.style?.grabbers?.strokeDasharray\"\n [attr.x1]=\"axis.orientation === orientation.x ? from : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? from : width\"\n [attr.data-grabber]=\"'from'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : from\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : from\">\n</svg:line>\n\n<svg:line class=\"display-grabber\"\n *ngIf=\"plotBand.showGrabbers && plotBand.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"plotBand.style?.grabbers?.strokeWidth || 4\"\n [attr.stroke-dasharray]=\"plotBand.style?.grabbers?.strokeDasharray\"\n [attr.x1]=\"axis.orientation === orientation.x ? to : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? to : width\"\n [attr.data-grabber]=\"'to'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : to\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : to\">\n</svg:line>\n\n<svg:line class=\"grabber\"\n *ngIf=\"plotBand.resizable\"\n [class.x-grabber]=\"axis.orientation === orientation.x\"\n [class.y-grabber]=\"axis.orientation === orientation.y\"\n [class.resizeable]=\"plotBand?.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"8\"\n [style.transform]=\"axis.orientation === orientation.x ? 'translateX(2px)' : 'translateY(2px)'\"\n [attr.x1]=\"axis.orientation === orientation.x ? from : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? from : width\"\n [attr.data-grabber]=\"'from'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : from\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : from\">\n</svg:line>\n<svg:line class=\"grabber\"\n *ngIf=\"plotBand.resizable\"\n [class.x-grabber]=\"axis.orientation === orientation.x\"\n [class.y-grabber]=\"axis.orientation === orientation.y\"\n [class.resizeable]=\"plotBand?.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"8\"\n [style.transform]=\"axis.orientation === orientation.x ? 'translateX(-2px)' : 'translateY(-2px)'\"\n [attr.x1]=\"axis.orientation === orientation.x ? to : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? to : width\"\n [attr.data-grabber]=\"'to'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : to\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : to\">\n</svg:line>\n\n\n", styles: [":host .draggable rect:hover{cursor:grab}:host .draggable rect:active{cursor:grabbing}:host .x-grabber.resizeable{cursor:col-resize}:host .y-grabber.resizeable{cursor:row-resize}:host:hover .grabber{opacity:.1}.grabber{opacity:0}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1851
1859
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PlotBandComponent, decorators: [{
|
|
1852
1860
|
type: Component,
|
|
1853
|
-
args: [{ selector: '[teta-plot-band]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg:rect\n class=\"plotband\" xmlns:svg=\"http://www.w3.org/1999/html\"\n [class.draggable]=\"plotBand?.draggable === true\"\n [attr.fill]=\"getFill(plotBand)\"\n [attr.opacity]=\"plotBand.style?.plotBand?.opacity\"\n [attr.height]=\"axis.orientation === orientation.x ? height : bandSize\"\n [attr.width]=\"axis.orientation === orientation.x ? bandSize : width\"\n [attr.y]=\"axis.orientation === orientation.y ? from : null\"\n [attr.x]=\"axis.orientation === orientation.x ? from : null\">\n</svg:rect>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.x\"\n text-anchor=\"middle\"\n dominant-baseline=\"central\"\n class=\"label font-
|
|
1861
|
+
args: [{ selector: '[teta-plot-band]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg:rect\n class=\"plotband\" xmlns:svg=\"http://www.w3.org/1999/html\"\n [class.draggable]=\"plotBand?.draggable === true\"\n [attr.fill]=\"getFill(plotBand)\"\n [attr.opacity]=\"plotBand.style?.plotBand?.opacity\"\n [attr.height]=\"axis.orientation === orientation.x ? height : bandSize\"\n [attr.width]=\"axis.orientation === orientation.x ? bandSize : width\"\n [attr.y]=\"axis.orientation === orientation.y ? from : null\"\n [attr.x]=\"axis.orientation === orientation.x ? from : null\">\n</svg:rect>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.x\"\n text-anchor=\"middle\"\n dominant-baseline=\"central\"\n class=\"label font-caption fill-text-90\"\n [attr.x]=\"getTextCenter()\"\n [attr.transform]=\"'rotate(-90, '+ getTextCenter() +',' + height / 2 + ')'\"\n [attr.y]=\"height / 2\">{{plotBand.label}}\n</svg:text>\n\n<svg:text\n *ngIf=\"axis.orientation === orientation.y\"\n text-anchor=\"middle\"\n class=\"label font-caption fill-text-90\"\n dominant-baseline=\"central\"\n [attr.x]=\"getTextCenter()\"\n [attr.y]=\"width / 2\">{{plotBand.label}}\n</svg:text>\n\n<svg:line class=\"display-grabber\"\n *ngIf=\"plotBand.showGrabbers && plotBand.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"plotBand.style?.grabbers?.strokeWidth || 4\"\n [attr.stroke-dasharray]=\"plotBand.style?.grabbers?.strokeDasharray\"\n [attr.x1]=\"axis.orientation === orientation.x ? from : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? from : width\"\n [attr.data-grabber]=\"'from'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : from\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : from\">\n</svg:line>\n\n<svg:line class=\"display-grabber\"\n *ngIf=\"plotBand.showGrabbers && plotBand.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"plotBand.style?.grabbers?.strokeWidth || 4\"\n [attr.stroke-dasharray]=\"plotBand.style?.grabbers?.strokeDasharray\"\n [attr.x1]=\"axis.orientation === orientation.x ? to : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? to : width\"\n [attr.data-grabber]=\"'to'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : to\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : to\">\n</svg:line>\n\n<svg:line class=\"grabber\"\n *ngIf=\"plotBand.resizable\"\n [class.x-grabber]=\"axis.orientation === orientation.x\"\n [class.y-grabber]=\"axis.orientation === orientation.y\"\n [class.resizeable]=\"plotBand?.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"8\"\n [style.transform]=\"axis.orientation === orientation.x ? 'translateX(2px)' : 'translateY(2px)'\"\n [attr.x1]=\"axis.orientation === orientation.x ? from : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? from : width\"\n [attr.data-grabber]=\"'from'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : from\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : from\">\n</svg:line>\n<svg:line class=\"grabber\"\n *ngIf=\"plotBand.resizable\"\n [class.x-grabber]=\"axis.orientation === orientation.x\"\n [class.y-grabber]=\"axis.orientation === orientation.y\"\n [class.resizeable]=\"plotBand?.resizable\"\n [attr.stroke]=\"plotBand.style?.grabbers?.stroke || 'var(--color-text-50)'\"\n [attr.stroke-width]=\"8\"\n [style.transform]=\"axis.orientation === orientation.x ? 'translateX(-2px)' : 'translateY(-2px)'\"\n [attr.x1]=\"axis.orientation === orientation.x ? to : 0\"\n [attr.x2]=\"axis.orientation === orientation.x ? to : width\"\n [attr.data-grabber]=\"'to'\"\n [attr.y1]=\"axis.orientation === orientation.x ? 0 : to\"\n [attr.y2]=\"axis.orientation === orientation.x ? height : to\">\n</svg:line>\n\n\n", styles: [":host .draggable rect:hover{cursor:grab}:host .draggable rect:active{cursor:grabbing}:host .x-grabber.resizeable{cursor:col-resize}:host .y-grabber.resizeable{cursor:row-resize}:host:hover .grabber{opacity:.1}.grabber{opacity:0}\n"] }]
|
|
1854
1862
|
}], ctorParameters: function () { return [{ type: ScaleService }, { type: ZoomService }, { type: ChartService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { plotBand: [{
|
|
1855
1863
|
type: Input
|
|
1856
1864
|
}], axis: [{
|
|
@@ -2292,8 +2300,8 @@ class AnnotationComponent {
|
|
|
2292
2300
|
this.scaleService = scaleService;
|
|
2293
2301
|
this.cdr = cdr;
|
|
2294
2302
|
this.chartService = chartService;
|
|
2295
|
-
this.x = this.scaleService.scales.pipe(map((_) => { var _a; return _.x.get((_a = this.annotation.xAxisIndex) !== null && _a !== void 0 ? _a : 0).scale; }));
|
|
2296
|
-
this.y = this.scaleService.scales.pipe(map((_) => { var _a; return _.y.get((_a = this.annotation.yAxisIndex) !== null && _a !== void 0 ? _a : 0).scale; }));
|
|
2303
|
+
this.x = this.scaleService.scales.pipe(map((_) => { var _a, _b; return (_b = _.x.get((_a = this.annotation.xAxisIndex) !== null && _a !== void 0 ? _a : 0)) === null || _b === void 0 ? void 0 : _b.scale; }));
|
|
2304
|
+
this.y = this.scaleService.scales.pipe(map((_) => { var _a, _b; return (_b = _.y.get((_a = this.annotation.yAxisIndex) !== null && _a !== void 0 ? _a : 0)) === null || _b === void 0 ? void 0 : _b.scale; }));
|
|
2297
2305
|
this.drag = d3.drag();
|
|
2298
2306
|
}
|
|
2299
2307
|
set annotation(annotation) {
|
|
@@ -2342,10 +2350,10 @@ class AnnotationComponent {
|
|
|
2342
2350
|
}
|
|
2343
2351
|
}
|
|
2344
2352
|
AnnotationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: AnnotationComponent, deps: [{ token: ScaleService }, { token: i0.ChangeDetectorRef }, { token: ChartService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2345
|
-
AnnotationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: AnnotationComponent, selector: "[teta-annotation]", inputs: { annotation: "annotation" }, host: { listeners: { "click": "click($event)", "contextmenu": "contextMenu($event)" } }, viewQueries: [{ propertyName: "node", first: true, predicate: ["annotationNode"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"{\n x: x | async,\n y: y | async\n } as data\">\n <svg:circle\n
|
|
2353
|
+
AnnotationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: AnnotationComponent, selector: "[teta-annotation]", inputs: { annotation: "annotation" }, host: { listeners: { "click": "click($event)", "contextmenu": "contextMenu($event)" } }, viewQueries: [{ propertyName: "node", first: true, predicate: ["annotationNode"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"{\n x: x | async,\n y: y | async\n } as data\">\n <ng-container *ngIf=\"data.x && data.y\">\n\n\n <svg:circle\n [attr.r]=\"annotation.style?.radius ?? 5\"\n [attr.cx]=\"data.x(annotation.point.x)\"\n [attr.fill]=\"annotation?.style?.fill ?? 'var(--color-text-90)'\"\n [attr.cy]=\"data.y(annotation.point.y)\">\n </svg:circle>\n <svg:line\n [attr.x1]=\"data.x(annotation.point.x)\"\n [attr.y1]=\"data.y(annotation.point.y)\"\n [attr.x2]=\"data.x(annotation.point.x) + (annotation.dx ?? 0)\"\n [attr.y2]=\"data.y(annotation.point.y) + (annotation.dy ?? 0)\"\n [attr.stroke]=\"annotation.style?.stroke ?? 'var(--color-text-90)'\"\n [attr.stroke-width]=\"annotation.style?.strokeWidth ?? 1\"\n [attr.stroke-dasharray]=\"annotation.style?.strokeDasharray ?? null\"\n >\n </svg:line>\n <svg:foreignObject\n class=\"position-absolute\"\n [attr.width]=\"node?.nativeElement.offsetWidth ?? 0\"\n [attr.height]=\"node?.nativeElement.offsetHeight ?? 0\"\n [attr.x]=\"data.x(annotation.point.x) + (annotation.dx ?? 0) - 10\"\n [attr.y]=\"data.y(annotation.point.y) + (annotation.dy ?? 0) - 10\">\n <div\n #annotationNode\n [style.background-color]=\"annotation.style?.fill ?? 'var(--color-text-90)'\"\n [style.cursor]=\"annotation?.draggable ? 'move' : 'default'\"\n [className]=\"'padding-h-2 ' + annotation.className ?? ''\"\n style=\"border-radius: 2px; display: inline-block;\">\n <ng-container *ngIf=\"annotation.template;else default\">\n <ng-container *ngTemplateOutlet=\"annotation.template;context: {$implicit: annotation}\"></ng-container>\n </ng-container>\n </div>\n </svg:foreignObject>\n </ng-container>\n</ng-container>\n<ng-template #default>\n {{ annotation.note?.label}}\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2346
2354
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: AnnotationComponent, decorators: [{
|
|
2347
2355
|
type: Component,
|
|
2348
|
-
args: [{ selector: '[teta-annotation]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n x: x | async,\n y: y | async\n } as data\">\n <svg:circle\n
|
|
2356
|
+
args: [{ selector: '[teta-annotation]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n x: x | async,\n y: y | async\n } as data\">\n <ng-container *ngIf=\"data.x && data.y\">\n\n\n <svg:circle\n [attr.r]=\"annotation.style?.radius ?? 5\"\n [attr.cx]=\"data.x(annotation.point.x)\"\n [attr.fill]=\"annotation?.style?.fill ?? 'var(--color-text-90)'\"\n [attr.cy]=\"data.y(annotation.point.y)\">\n </svg:circle>\n <svg:line\n [attr.x1]=\"data.x(annotation.point.x)\"\n [attr.y1]=\"data.y(annotation.point.y)\"\n [attr.x2]=\"data.x(annotation.point.x) + (annotation.dx ?? 0)\"\n [attr.y2]=\"data.y(annotation.point.y) + (annotation.dy ?? 0)\"\n [attr.stroke]=\"annotation.style?.stroke ?? 'var(--color-text-90)'\"\n [attr.stroke-width]=\"annotation.style?.strokeWidth ?? 1\"\n [attr.stroke-dasharray]=\"annotation.style?.strokeDasharray ?? null\"\n >\n </svg:line>\n <svg:foreignObject\n class=\"position-absolute\"\n [attr.width]=\"node?.nativeElement.offsetWidth ?? 0\"\n [attr.height]=\"node?.nativeElement.offsetHeight ?? 0\"\n [attr.x]=\"data.x(annotation.point.x) + (annotation.dx ?? 0) - 10\"\n [attr.y]=\"data.y(annotation.point.y) + (annotation.dy ?? 0) - 10\">\n <div\n #annotationNode\n [style.background-color]=\"annotation.style?.fill ?? 'var(--color-text-90)'\"\n [style.cursor]=\"annotation?.draggable ? 'move' : 'default'\"\n [className]=\"'padding-h-2 ' + annotation.className ?? ''\"\n style=\"border-radius: 2px; display: inline-block;\">\n <ng-container *ngIf=\"annotation.template;else default\">\n <ng-container *ngTemplateOutlet=\"annotation.template;context: {$implicit: annotation}\"></ng-container>\n </ng-container>\n </div>\n </svg:foreignObject>\n </ng-container>\n</ng-container>\n<ng-template #default>\n {{ annotation.note?.label}}\n</ng-template>\n" }]
|
|
2349
2357
|
}], ctorParameters: function () { return [{ type: ScaleService }, { type: i0.ChangeDetectorRef }, { type: ChartService }]; }, propDecorators: { annotation: [{
|
|
2350
2358
|
type: Input
|
|
2351
2359
|
}], node: [{
|
|
@@ -2513,8 +2521,9 @@ class ChartContainerComponent {
|
|
|
2513
2521
|
return item.value.index;
|
|
2514
2522
|
}
|
|
2515
2523
|
click(event, xScales, yScales) {
|
|
2516
|
-
|
|
2517
|
-
const
|
|
2524
|
+
var _a, _b;
|
|
2525
|
+
const x = (_a = xScales.get(0)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
2526
|
+
const y = (_b = yScales.get(0)) === null || _b === void 0 ? void 0 : _b.scale;
|
|
2518
2527
|
this._svc.emitChartClick({
|
|
2519
2528
|
event: event,
|
|
2520
2529
|
target: {
|
|
@@ -2524,8 +2533,9 @@ class ChartContainerComponent {
|
|
|
2524
2533
|
});
|
|
2525
2534
|
}
|
|
2526
2535
|
contextMenu(event, xScales, yScales) {
|
|
2527
|
-
|
|
2528
|
-
const
|
|
2536
|
+
var _a, _b;
|
|
2537
|
+
const x = (_a = xScales.get(0)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
2538
|
+
const y = (_b = yScales.get(0)) === null || _b === void 0 ? void 0 : _b.scale;
|
|
2529
2539
|
this._svc.emitChartContextMenu({
|
|
2530
2540
|
event: event,
|
|
2531
2541
|
target: {
|
|
@@ -2569,10 +2579,10 @@ class LegendComponent {
|
|
|
2569
2579
|
}
|
|
2570
2580
|
}
|
|
2571
2581
|
LegendComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: LegendComponent, deps: [{ token: ChartService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2572
|
-
LegendComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: LegendComponent, selector: "teta-legend", inputs: { series: "series" }, host: { properties: { "class.padding-bottom-4": "this.classLegend" } }, ngImport: i0, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"
|
|
2582
|
+
LegendComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: LegendComponent, selector: "teta-legend", inputs: { series: "series" }, host: { properties: { "class.padding-bottom-4": "this.classLegend" } }, ngImport: i0, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"\n [style.height.px]=\"getHeight(serie)\"\n [style.border-top-color]=\"serie.visible ? serie.color : 'var(--color-text-30)'\"\n [style.border-top-style]=\"serie.style?.strokeDasharray ? 'dashed' : 'solid'\"\n [style.border-width.px]=\"serie.style?.strokeDasharray ? 1 : 2\"></div>\n <div class=\"legend-label\" style=\"user-select: none\" [style.text-decoration]=\"serie.visible ? 'none' : 'line-through'\">{{ serie.name }}</div>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:flex;grid-gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-evenly}:host .legend-item{display:flex;align-items:center}:host .legend-icon-form{width:12px}:host .legend-label{margin-left:5px}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2573
2583
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: LegendComponent, decorators: [{
|
|
2574
2584
|
type: Component,
|
|
2575
|
-
args: [{ selector: 'teta-legend', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"
|
|
2585
|
+
args: [{ selector: 'teta-legend', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let serie of series\" class=\"padding-bottom-4\">\n <div *ngIf=\"serie?.showInLegend !== false\">\n <div class=\"legend-item cursor-pointer\" (click)=\"click(serie)\">\n <div class=\"legend-icon-form\"\n [style.height.px]=\"getHeight(serie)\"\n [style.border-top-color]=\"serie.visible ? serie.color : 'var(--color-text-30)'\"\n [style.border-top-style]=\"serie.style?.strokeDasharray ? 'dashed' : 'solid'\"\n [style.border-width.px]=\"serie.style?.strokeDasharray ? 1 : 2\"></div>\n <div class=\"legend-label\" style=\"user-select: none\" [style.text-decoration]=\"serie.visible ? 'none' : 'line-through'\">{{ serie.name }}</div>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:flex;grid-gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-evenly}:host .legend-item{display:flex;align-items:center}:host .legend-icon-form{width:12px}:host .legend-label{margin-left:5px}\n"] }]
|
|
2576
2586
|
}], ctorParameters: function () { return [{ type: ChartService }]; }, propDecorators: { series: [{
|
|
2577
2587
|
type: Input
|
|
2578
2588
|
}], classLegend: [{
|