@tetacom/svg-charts 1.2.11 → 1.2.14
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/chart/chart-container/tooltip/tooltip.component.d.ts +8 -6
- package/chart/chart-container/x-axis/x-axis.component.d.ts +4 -1
- package/chart/chart.module.d.ts +2 -1
- package/esm2020/chart/chart/chart.component.mjs +3 -3
- package/esm2020/chart/chart-container/chart-container.component.mjs +4 -4
- package/esm2020/chart/chart-container/tooltip/tooltip.component.mjs +22 -21
- package/esm2020/chart/chart-container/x-axis/x-axis.component.mjs +17 -8
- package/esm2020/chart/chart.module.mjs +5 -4
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/tetacom-svg-charts.mjs +42 -36
- package/fesm2015/tetacom-svg-charts.mjs.map +1 -1
- package/fesm2020/tetacom-svg-charts.mjs +41 -35
- package/fesm2020/tetacom-svg-charts.mjs.map +1 -1
- package/package.json +2 -2
- package/public-api.d.ts +1 -0
|
@@ -1,15 +1,24 @@
|
|
|
1
1
|
import { ChangeDetectionStrategy, Component, Input, } from '@angular/core';
|
|
2
|
-
import { map } from "rxjs";
|
|
2
|
+
import { map, withLatestFrom } from "rxjs";
|
|
3
|
+
import { getTextWidth } from "../../core/utils/get-text-width";
|
|
4
|
+
import * as d3 from 'd3';
|
|
3
5
|
import * as i0 from "@angular/core";
|
|
4
6
|
import * as i1 from "../../service/scale.service";
|
|
5
|
-
import * as i2 from "
|
|
7
|
+
import * as i2 from "../../service/chart.service";
|
|
8
|
+
import * as i3 from "@angular/common";
|
|
6
9
|
export class XAxisComponent {
|
|
7
|
-
constructor(scaleService) {
|
|
10
|
+
constructor(scaleService, _svc) {
|
|
8
11
|
this.scaleService = scaleService;
|
|
12
|
+
this._svc = _svc;
|
|
9
13
|
this._alive = true;
|
|
10
14
|
this.x = this.scaleService.scales.pipe(map((_) => {
|
|
11
15
|
return _.x.get(this.axis.index)?.scale;
|
|
12
16
|
}));
|
|
17
|
+
this.ticks = this.x.pipe(withLatestFrom(this._svc.size), map((_) => {
|
|
18
|
+
const [x, size] = _;
|
|
19
|
+
const maxSymbolLength = parseInt(d3.max(x.ticks().map((_) => getTextWidth(this.axis.options.tickFormat ? this.axis.options.tickFormat(_) : this.axis.defaultFormatter()(_)))), 10);
|
|
20
|
+
return x.ticks(size.width / (maxSymbolLength * 2.5));
|
|
21
|
+
}));
|
|
13
22
|
}
|
|
14
23
|
getLabelTransform() {
|
|
15
24
|
return `translate(${this.size.width / 2}, ${this.axis.options.opposite ? -32 : 32})`;
|
|
@@ -19,14 +28,14 @@ export class XAxisComponent {
|
|
|
19
28
|
this._alive = false;
|
|
20
29
|
}
|
|
21
30
|
}
|
|
22
|
-
XAxisComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, deps: [{ token: i1.ScaleService }], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
-
XAxisComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: XAxisComponent, selector: "[teta-x-axis]", inputs: { axis: "axis", size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"x | async as
|
|
31
|
+
XAxisComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, deps: [{ token: i1.ScaleService }, { token: i2.ChartService }], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
+
XAxisComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: XAxisComponent, selector: "[teta-x-axis]", inputs: { axis: "axis", size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"{x: x | async, ticks: ticks | async} as data\">\n <svg:g text-anchor=\"middle\" *ngFor=\"let tick of data.ticks\" [attr.transform]=\"'translate('+ data.x(tick) +', 0)'\">\n <text fill=\"var(--color-text-70)\" [attr.dy]=\"axis.options.opposite ? '-0.71em' : '0.71em'\" [attr.y]=\"axis.options.opposite ? 0 : 9\">{{ this.axis.options.tickFormat ? this.axis.options.tickFormat(tick) : this.axis.defaultFormatter()(tick) }}</text>\n <line stroke=\"var(--color-text-30)\" [attr.y2]=\"axis.options.opposite ? -6 : 6\"></line>\n </svg:g>\n\n <svg:g class=\"label-axis font-caption\" [attr.transform]=\"getLabelTransform()\">\n <text fill=\"var(--color-text-70)\" text-anchor=\"middle\" dominant-baseline=\"middle\">{{ axis.options.title }}</text>\n </svg:g>\n</ng-container>\n\n", styles: [":host .tick{stroke:var(--color-text-20)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
24
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, decorators: [{
|
|
25
34
|
type: Component,
|
|
26
|
-
args: [{ selector: '[teta-x-axis]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"x | async as
|
|
27
|
-
}], ctorParameters: function () { return [{ type: i1.ScaleService }]; }, propDecorators: { axis: [{
|
|
35
|
+
args: [{ selector: '[teta-x-axis]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{x: x | async, ticks: ticks | async} as data\">\n <svg:g text-anchor=\"middle\" *ngFor=\"let tick of data.ticks\" [attr.transform]=\"'translate('+ data.x(tick) +', 0)'\">\n <text fill=\"var(--color-text-70)\" [attr.dy]=\"axis.options.opposite ? '-0.71em' : '0.71em'\" [attr.y]=\"axis.options.opposite ? 0 : 9\">{{ this.axis.options.tickFormat ? this.axis.options.tickFormat(tick) : this.axis.defaultFormatter()(tick) }}</text>\n <line stroke=\"var(--color-text-30)\" [attr.y2]=\"axis.options.opposite ? -6 : 6\"></line>\n </svg:g>\n\n <svg:g class=\"label-axis font-caption\" [attr.transform]=\"getLabelTransform()\">\n <text fill=\"var(--color-text-70)\" text-anchor=\"middle\" dominant-baseline=\"middle\">{{ axis.options.title }}</text>\n </svg:g>\n</ng-container>\n\n", styles: [":host .tick{stroke:var(--color-text-20)}\n"] }]
|
|
36
|
+
}], ctorParameters: function () { return [{ type: i1.ScaleService }, { type: i2.ChartService }]; }, propDecorators: { axis: [{
|
|
28
37
|
type: Input
|
|
29
38
|
}], size: [{
|
|
30
39
|
type: Input
|
|
31
40
|
}] } });
|
|
32
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
41
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoieC1heGlzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jaGFydC9jaGFydC1jb250YWluZXIveC1heGlzL3gtYXhpcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvY2hhcnQvY2hhcnQtY29udGFpbmVyL3gtYXhpcy94LWF4aXMuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVMLHVCQUF1QixFQUV2QixTQUFTLEVBRVQsS0FBSyxHQUdOLE1BQU0sZUFBZSxDQUFDO0FBR3ZCLE9BQU8sRUFBZ0IsR0FBRyxFQUFvQixjQUFjLEVBQUMsTUFBTSxNQUFNLENBQUM7QUFFMUUsT0FBTyxFQUFDLFlBQVksRUFBQyxNQUFNLGlDQUFpQyxDQUFDO0FBQzdELE9BQU8sS0FBSyxFQUFFLE1BQU0sSUFBSSxDQUFDOzs7OztBQVV6QixNQUFNLE9BQU8sY0FBYztJQVN6QixZQUFvQixZQUEwQixFQUFVLElBQWtCO1FBQXRELGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQVUsU0FBSSxHQUFKLElBQUksQ0FBYztRQUZsRSxXQUFNLEdBQUcsSUFBSSxDQUFDO1FBR3BCLElBQUksQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFO1lBQy9DLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsRUFBRSxLQUFLLENBQUE7UUFDeEMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtRQUdILElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQ3RCLGNBQWMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxFQUM5QixHQUFHLENBQUMsQ0FBQyxDQUFpQixFQUFFLEVBQUU7WUFDeEIsTUFBTSxDQUFDLENBQUMsRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDcEIsTUFBTSxlQUFlLEdBQUcsUUFBUSxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEtBQUssRUFBRSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7WUFDbkwsT0FBTyxDQUFDLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxLQUFLLEdBQUcsQ0FBQyxlQUFlLEdBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQTtRQUNwRCxDQUFDLENBQUMsQ0FDSCxDQUFBO0lBQ0gsQ0FBQztJQUVELGlCQUFpQjtRQUNmLE9BQU8sYUFDTCxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUNwQixLQUFLLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLEVBQUUsR0FBRyxDQUFDO0lBQ2hELENBQUM7SUFFRCxRQUFRLEtBQVUsQ0FBQztJQUVuQixXQUFXO1FBQ1QsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7SUFDdEIsQ0FBQzs7MkdBbkNVLGNBQWM7K0ZBQWQsY0FBYyw2RkN6QjNCLHl5QkFXQTsyRkRjYSxjQUFjO2tCQU4xQixTQUFTOytCQUNFLGVBQWUsbUJBR1IsdUJBQXVCLENBQUMsTUFBTTs4SEFNdEMsSUFBSTtzQkFBWixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIEFmdGVyVmlld0luaXQsXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDaGFuZ2VEZXRlY3RvclJlZixcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBJbnB1dCxcbiAgT25EZXN0cm95LFxuICBPbkluaXQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQXhpcyB9IGZyb20gJy4uLy4uL2NvcmUvYXhpcy9heGlzJztcblxuaW1wb3J0IHtsYXN0VmFsdWVGcm9tLCBtYXAsIE9ic2VydmFibGUsIHRha2UsIHdpdGhMYXRlc3RGcm9tfSBmcm9tIFwicnhqc1wiO1xuaW1wb3J0IHtTY2FsZVNlcnZpY2V9IGZyb20gXCIuLi8uLi9zZXJ2aWNlL3NjYWxlLnNlcnZpY2VcIjtcbmltcG9ydCB7Z2V0VGV4dFdpZHRofSBmcm9tIFwiLi4vLi4vY29yZS91dGlscy9nZXQtdGV4dC13aWR0aFwiO1xuaW1wb3J0ICogYXMgZDMgZnJvbSAnZDMnO1xuaW1wb3J0IHtDaGFydFNlcnZpY2V9IGZyb20gXCIuLi8uLi9zZXJ2aWNlL2NoYXJ0LnNlcnZpY2VcIjtcbmltcG9ydCB7SUNoYXJ0Q29uZmlnfSBmcm9tIFwiLi4vLi4vbW9kZWwvaS1jaGFydC1jb25maWdcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnW3RldGEteC1heGlzXScsXG4gIHRlbXBsYXRlVXJsOiAnLi94LWF4aXMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi94LWF4aXMuY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFhBeGlzQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgeDogT2JzZXJ2YWJsZTxhbnk+O1xuICB0aWNrczogT2JzZXJ2YWJsZTxhbnlbXT5cblxuICBASW5wdXQoKSBheGlzOiBBeGlzO1xuICBASW5wdXQoKSBzaXplOiBET01SZWN0O1xuXG4gIHByaXZhdGUgX2FsaXZlID0gdHJ1ZTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHNjYWxlU2VydmljZTogU2NhbGVTZXJ2aWNlLCBwcml2YXRlIF9zdmM6IENoYXJ0U2VydmljZSkge1xuICAgIHRoaXMueCA9IHRoaXMuc2NhbGVTZXJ2aWNlLnNjYWxlcy5waXBlKG1hcCgoXykgPT4ge1xuICAgICAgcmV0dXJuIF8ueC5nZXQodGhpcy5heGlzLmluZGV4KT8uc2NhbGVcbiAgICB9KSlcblxuXG4gICAgdGhpcy50aWNrcyA9IHRoaXMueC5waXBlKFxuICAgICAgd2l0aExhdGVzdEZyb20odGhpcy5fc3ZjLnNpemUpLFxuICAgICAgbWFwKChfOiBbYW55LCBET01SZWN0XSkgPT4ge1xuICAgICAgICBjb25zdCBbeCwgc2l6ZV0gPSBfO1xuICAgICAgICBjb25zdCBtYXhTeW1ib2xMZW5ndGggPSBwYXJzZUludChkMy5tYXgoeC50aWNrcygpLm1hcCgoXykgPT4gZ2V0VGV4dFdpZHRoKHRoaXMuYXhpcy5vcHRpb25zLnRpY2tGb3JtYXQgPyB0aGlzLmF4aXMub3B0aW9ucy50aWNrRm9ybWF0KF8pIDogdGhpcy5heGlzLmRlZmF1bHRGb3JtYXR0ZXIoKShfKSkpKSwgMTApO1xuICAgICAgICByZXR1cm4geC50aWNrcyhzaXplLndpZHRoIC8gKG1heFN5bWJvbExlbmd0aCoyLjUpKVxuICAgICAgfSlcbiAgICApXG4gIH1cblxuICBnZXRMYWJlbFRyYW5zZm9ybSgpIHtcbiAgICByZXR1cm4gYHRyYW5zbGF0ZSgke1xuICAgICAgdGhpcy5zaXplLndpZHRoIC8gMlxuICAgIH0sICR7dGhpcy5heGlzLm9wdGlvbnMub3Bwb3NpdGUgPyAtMzIgOiAzMn0pYDtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge31cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLl9hbGl2ZSA9IGZhbHNlO1xuICB9XG5cbn1cbiIsIjxuZy1jb250YWluZXIgKm5nSWY9XCJ7eDogeCB8IGFzeW5jLCB0aWNrczogdGlja3MgfCBhc3luY30gYXMgZGF0YVwiPlxuICA8c3ZnOmcgdGV4dC1hbmNob3I9XCJtaWRkbGVcIiAqbmdGb3I9XCJsZXQgdGljayBvZiBkYXRhLnRpY2tzXCIgW2F0dHIudHJhbnNmb3JtXT1cIid0cmFuc2xhdGUoJysgZGF0YS54KHRpY2spICsnLCAwKSdcIj5cbiAgICA8dGV4dCBmaWxsPVwidmFyKC0tY29sb3ItdGV4dC03MClcIiBbYXR0ci5keV09XCJheGlzLm9wdGlvbnMub3Bwb3NpdGUgPyAnLTAuNzFlbScgOiAnMC43MWVtJ1wiIFthdHRyLnldPVwiYXhpcy5vcHRpb25zLm9wcG9zaXRlID8gMCA6IDlcIj57eyB0aGlzLmF4aXMub3B0aW9ucy50aWNrRm9ybWF0ID8gdGhpcy5heGlzLm9wdGlvbnMudGlja0Zvcm1hdCh0aWNrKSA6IHRoaXMuYXhpcy5kZWZhdWx0Rm9ybWF0dGVyKCkodGljaykgfX08L3RleHQ+XG4gICAgPGxpbmUgc3Ryb2tlPVwidmFyKC0tY29sb3ItdGV4dC0zMClcIiBbYXR0ci55Ml09XCJheGlzLm9wdGlvbnMub3Bwb3NpdGUgPyAtNiA6IDZcIj48L2xpbmU+XG4gIDwvc3ZnOmc+XG5cbiAgPHN2ZzpnIGNsYXNzPVwibGFiZWwtYXhpcyBmb250LWNhcHRpb25cIiBbYXR0ci50cmFuc2Zvcm1dPVwiZ2V0TGFiZWxUcmFuc2Zvcm0oKVwiPlxuICAgIDx0ZXh0IGZpbGw9XCJ2YXIoLS1jb2xvci10ZXh0LTcwKVwiICB0ZXh0LWFuY2hvcj1cIm1pZGRsZVwiIGRvbWluYW50LWJhc2VsaW5lPVwibWlkZGxlXCI+e3sgYXhpcy5vcHRpb25zLnRpdGxlIH19PC90ZXh0PlxuICA8L3N2ZzpnPlxuPC9uZy1jb250YWluZXI+XG5cbiJdfQ==
|
|
@@ -22,6 +22,7 @@ import { AreaSeriesComponent } from './chart-container/series/area-series/area-s
|
|
|
22
22
|
import { AnnotationComponent } from './chart-container/annotation/annotation.component';
|
|
23
23
|
import { LinearSeriesBase } from './chart-container/series/linear-series-base';
|
|
24
24
|
import { CrosshairComponent } from './chart-container/crosshair/crosshair.component';
|
|
25
|
+
import { LetModule } from '@tetacom/ng-components';
|
|
25
26
|
import * as i0 from "@angular/core";
|
|
26
27
|
export class ChartModule {
|
|
27
28
|
}
|
|
@@ -47,7 +48,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
47
48
|
BlockSeriesComponent,
|
|
48
49
|
BlockAreaSeriesComponent,
|
|
49
50
|
AnnotationComponent,
|
|
50
|
-
CrosshairComponent], imports: [CommonModule], exports: [ChartComponent,
|
|
51
|
+
CrosshairComponent], imports: [CommonModule, LetModule], exports: [ChartComponent,
|
|
51
52
|
LegendComponent,
|
|
52
53
|
SeriesBaseComponent,
|
|
53
54
|
LineSeriesComponent,
|
|
@@ -56,7 +57,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
56
57
|
AreaSeriesComponent,
|
|
57
58
|
BlockSeriesComponent,
|
|
58
59
|
BlockAreaSeriesComponent] });
|
|
59
|
-
ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule] });
|
|
60
|
+
ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule, LetModule] });
|
|
60
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, decorators: [{
|
|
61
62
|
type: NgModule,
|
|
62
63
|
args: [{
|
|
@@ -95,7 +96,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
|
|
|
95
96
|
BlockSeriesComponent,
|
|
96
97
|
BlockAreaSeriesComponent,
|
|
97
98
|
],
|
|
98
|
-
imports: [CommonModule],
|
|
99
|
+
imports: [CommonModule, LetModule],
|
|
99
100
|
}]
|
|
100
101
|
}] });
|
|
101
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
102
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hhcnQubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NoYXJ0L2NoYXJ0Lm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsUUFBUSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ3ZDLE9BQU8sRUFBQyxZQUFZLEVBQUMsTUFBTSxpQkFBaUIsQ0FBQztBQUM3QyxPQUFPLEVBQUMsY0FBYyxFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDdkQsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0scURBQXFELENBQUM7QUFDeEYsT0FBTyxFQUFDLHVCQUF1QixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFDcEYsT0FBTyxFQUFDLGVBQWUsRUFBQyxNQUFNLDJCQUEyQixDQUFDO0FBQzFELE9BQU8sRUFBQyxtQkFBbUIsRUFBQyxNQUFNLDhCQUE4QixDQUFDO0FBQ2pFLE9BQU8sRUFBQyxtQkFBbUIsRUFBQyxNQUFNLHFEQUFxRCxDQUFDO0FBQ3hGLE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLGlEQUFpRCxDQUFDO0FBQ25GLE9BQU8sRUFBQyxjQUFjLEVBQUMsTUFBTSwyQ0FBMkMsQ0FBQztBQUN6RSxPQUFPLEVBQUMsY0FBYyxFQUFDLE1BQU0sMkNBQTJDLENBQUM7QUFDekUsT0FBTyxFQUFDLGlCQUFpQixFQUFDLE1BQU0sK0NBQStDLENBQUM7QUFDaEYsT0FBTyxFQUFDLGlCQUFpQixFQUFDLE1BQU0sZ0RBQWdELENBQUM7QUFDakYsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sbURBQW1ELENBQUM7QUFDckYsT0FBTyxFQUFDLGdCQUFnQixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFDN0UsT0FBTyxFQUFDLGlCQUFpQixFQUFDLE1BQU0saUNBQWlDLENBQUM7QUFDbEUsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sa0NBQWtDLENBQUM7QUFDcEUsT0FBTyxFQUFDLHNCQUFzQixFQUFDLE1BQU0sa0VBQWtFLENBQUM7QUFDeEcsT0FBTyxFQUFDLG9CQUFvQixFQUFDLE1BQU0sOERBQThELENBQUM7QUFDbEcsT0FBTyxFQUFDLHdCQUF3QixFQUFDLE1BQU0sd0VBQXdFLENBQUM7QUFDaEgsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sNERBQTRELENBQUM7QUFDL0YsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sbURBQW1ELENBQUM7QUFDdEYsT0FBTyxFQUFDLGdCQUFnQixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFDN0UsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0saURBQWlELENBQUM7QUFDckYsT0FBTyxFQUFDLFNBQVMsRUFBQyxNQUFNLHdCQUF3QixDQUFDOztBQXdDakQsTUFBTSxPQUFPLFdBQVc7O3dHQUFYLFdBQVc7eUdBQVgsV0FBVyxpQkFwQ3BCLGNBQWM7UUFDZCxtQkFBbUI7UUFDbkIsdUJBQXVCO1FBQ3ZCLGVBQWU7UUFDZixtQkFBbUI7UUFDbkIsZ0JBQWdCO1FBQ2hCLG1CQUFtQjtRQUNuQixrQkFBa0I7UUFDbEIsY0FBYztRQUNkLGNBQWM7UUFDZCxpQkFBaUI7UUFDakIsaUJBQWlCO1FBQ2pCLGtCQUFrQjtRQUNsQixnQkFBZ0I7UUFDaEIsaUJBQWlCO1FBQ2pCLGtCQUFrQjtRQUNsQixtQkFBbUI7UUFDbkIsc0JBQXNCO1FBQ3RCLG9CQUFvQjtRQUNwQix3QkFBd0I7UUFDeEIsbUJBQW1CO1FBQ25CLGtCQUFrQixhQWFWLFlBQVksRUFBRSxTQUFTLGFBVi9CLGNBQWM7UUFDZCxlQUFlO1FBQ2YsbUJBQW1CO1FBQ25CLG1CQUFtQjtRQUNuQixrQkFBa0I7UUFDbEIsc0JBQXNCO1FBQ3RCLG1CQUFtQjtRQUNuQixvQkFBb0I7UUFDcEIsd0JBQXdCO3lHQUlmLFdBQVcsWUFGWixZQUFZLEVBQUUsU0FBUzsyRkFFdEIsV0FBVztrQkF0Q3ZCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFO3dCQUNaLGNBQWM7d0JBQ2QsbUJBQW1CO3dCQUNuQix1QkFBdUI7d0JBQ3ZCLGVBQWU7d0JBQ2YsbUJBQW1CO3dCQUNuQixnQkFBZ0I7d0JBQ2hCLG1CQUFtQjt3QkFDbkIsa0JBQWtCO3dCQUNsQixjQUFjO3dCQUNkLGNBQWM7d0JBQ2QsaUJBQWlCO3dCQUNqQixpQkFBaUI7d0JBQ2pCLGtCQUFrQjt3QkFDbEIsZ0JBQWdCO3dCQUNoQixpQkFBaUI7d0JBQ2pCLGtCQUFrQjt3QkFDbEIsbUJBQW1CO3dCQUNuQixzQkFBc0I7d0JBQ3RCLG9CQUFvQjt3QkFDcEIsd0JBQXdCO3dCQUN4QixtQkFBbUI7d0JBQ25CLGtCQUFrQjtxQkFDbkI7b0JBQ0QsT0FBTyxFQUFFO3dCQUNQLGNBQWM7d0JBQ2QsZUFBZTt3QkFDZixtQkFBbUI7d0JBQ25CLG1CQUFtQjt3QkFDbkIsa0JBQWtCO3dCQUNsQixzQkFBc0I7d0JBQ3RCLG1CQUFtQjt3QkFDbkIsb0JBQW9CO3dCQUNwQix3QkFBd0I7cUJBQ3pCO29CQUNELE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxTQUFTLENBQUM7aUJBQ25DIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtOZ01vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0NvbW1vbk1vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7Q2hhcnRDb21wb25lbnR9IGZyb20gJy4vY2hhcnQvY2hhcnQuY29tcG9uZW50JztcbmltcG9ydCB7U2VyaWVzSG9zdENvbXBvbmVudH0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvc2VyaWVzLWhvc3Qvc2VyaWVzLWhvc3QuY29tcG9uZW50JztcbmltcG9ydCB7Q2hhcnRDb250YWluZXJDb21wb25lbnR9IGZyb20gJy4vY2hhcnQtY29udGFpbmVyL2NoYXJ0LWNvbnRhaW5lci5jb21wb25lbnQnO1xuaW1wb3J0IHtMZWdlbmRDb21wb25lbnR9IGZyb20gJy4vbGVnZW5kL2xlZ2VuZC5jb21wb25lbnQnO1xuaW1wb3J0IHtTZXJpZXNCYXNlQ29tcG9uZW50fSBmcm9tICcuL2Jhc2Uvc2VyaWVzLWJhc2UuY29tcG9uZW50JztcbmltcG9ydCB7TGluZVNlcmllc0NvbXBvbmVudH0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvc2VyaWVzL2xpbmUvbGluZS1zZXJpZXMuY29tcG9uZW50JztcbmltcG9ydCB7R3JpZGxpbmVzQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci9ncmlkbGluZXMvZ3JpZGxpbmVzLmNvbXBvbmVudCc7XG5pbXBvcnQge1hBeGlzQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci94LWF4aXMveC1heGlzLmNvbXBvbmVudCc7XG5pbXBvcnQge1lBeGlzQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci95LWF4aXMveS1heGlzLmNvbXBvbmVudCc7XG5pbXBvcnQge1Bsb3RsaW5lQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci9wbG90bGluZS9wbG90bGluZS5jb21wb25lbnQnO1xuaW1wb3J0IHtQbG90QmFuZENvbXBvbmVudH0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvcGxvdGJhbmQvcGxvdC1iYW5kLmNvbXBvbmVudCc7XG5pbXBvcnQge0JhclNlcmllc0NvbXBvbmVudH0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvc2VyaWVzL2Jhci9iYXItc2VyaWVzLmNvbXBvbmVudCc7XG5pbXBvcnQge1Rvb2x0aXBDb21wb25lbnR9IGZyb20gJy4vY2hhcnQtY29udGFpbmVyL3Rvb2x0aXAvdG9vbHRpcC5jb21wb25lbnQnO1xuaW1wb3J0IHtab29tYWJsZURpcmVjdGl2ZX0gZnJvbSAnLi9kaXJlY3RpdmVzL3pvb21hYmxlLmRpcmVjdGl2ZSc7XG5pbXBvcnQge0JydXNoYWJsZURpcmVjdGl2ZX0gZnJvbSAnLi9kaXJlY3RpdmVzL2JydXNoYWJsZS5kaXJlY3RpdmUnO1xuaW1wb3J0IHtTY2F0dGVyU2VyaWVzQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci9zZXJpZXMvc2NhdHRlci1zZXJpZXMvc2NhdHRlci1zZXJpZXMuY29tcG9uZW50JztcbmltcG9ydCB7QmxvY2tTZXJpZXNDb21wb25lbnR9IGZyb20gJy4vY2hhcnQtY29udGFpbmVyL3Nlcmllcy9ibG9jay1zZXJpZXMvYmxvY2stc2VyaWVzLmNvbXBvbmVudCc7XG5pbXBvcnQge0Jsb2NrQXJlYVNlcmllc0NvbXBvbmVudH0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvc2VyaWVzL2Jsb2NrLWFyZWEtc2VyaWVzL2Jsb2NrLWFyZWEtc2VyaWVzLmNvbXBvbmVudCc7XG5pbXBvcnQge0FyZWFTZXJpZXNDb21wb25lbnR9IGZyb20gJy4vY2hhcnQtY29udGFpbmVyL3Nlcmllcy9hcmVhLXNlcmllcy9hcmVhLXNlcmllcy5jb21wb25lbnQnO1xuaW1wb3J0IHtBbm5vdGF0aW9uQ29tcG9uZW50fSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci9hbm5vdGF0aW9uL2Fubm90YXRpb24uY29tcG9uZW50JztcbmltcG9ydCB7TGluZWFyU2VyaWVzQmFzZX0gZnJvbSAnLi9jaGFydC1jb250YWluZXIvc2VyaWVzL2xpbmVhci1zZXJpZXMtYmFzZSc7XG5pbXBvcnQgeyBDcm9zc2hhaXJDb21wb25lbnQgfSBmcm9tICcuL2NoYXJ0LWNvbnRhaW5lci9jcm9zc2hhaXIvY3Jvc3NoYWlyLmNvbXBvbmVudCc7XG5pbXBvcnQge0xldE1vZHVsZX0gZnJvbSAnQHRldGFjb20vbmctY29tcG9uZW50cyc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW1xuICAgIENoYXJ0Q29tcG9uZW50LFxuICAgIFNlcmllc0hvc3RDb21wb25lbnQsXG4gICAgQ2hhcnRDb250YWluZXJDb21wb25lbnQsXG4gICAgTGVnZW5kQ29tcG9uZW50LFxuICAgIFNlcmllc0Jhc2VDb21wb25lbnQsXG4gICAgTGluZWFyU2VyaWVzQmFzZSxcbiAgICBMaW5lU2VyaWVzQ29tcG9uZW50LFxuICAgIEdyaWRsaW5lc0NvbXBvbmVudCxcbiAgICBYQXhpc0NvbXBvbmVudCxcbiAgICBZQXhpc0NvbXBvbmVudCxcbiAgICBQbG90bGluZUNvbXBvbmVudCxcbiAgICBQbG90QmFuZENvbXBvbmVudCxcbiAgICBCYXJTZXJpZXNDb21wb25lbnQsXG4gICAgVG9vbHRpcENvbXBvbmVudCxcbiAgICBab29tYWJsZURpcmVjdGl2ZSxcbiAgICBCcnVzaGFibGVEaXJlY3RpdmUsXG4gICAgQXJlYVNlcmllc0NvbXBvbmVudCxcbiAgICBTY2F0dGVyU2VyaWVzQ29tcG9uZW50LFxuICAgIEJsb2NrU2VyaWVzQ29tcG9uZW50LFxuICAgIEJsb2NrQXJlYVNlcmllc0NvbXBvbmVudCxcbiAgICBBbm5vdGF0aW9uQ29tcG9uZW50LFxuICAgIENyb3NzaGFpckNvbXBvbmVudCxcbiAgXSxcbiAgZXhwb3J0czogW1xuICAgIENoYXJ0Q29tcG9uZW50LFxuICAgIExlZ2VuZENvbXBvbmVudCxcbiAgICBTZXJpZXNCYXNlQ29tcG9uZW50LFxuICAgIExpbmVTZXJpZXNDb21wb25lbnQsXG4gICAgQmFyU2VyaWVzQ29tcG9uZW50LFxuICAgIFNjYXR0ZXJTZXJpZXNDb21wb25lbnQsXG4gICAgQXJlYVNlcmllc0NvbXBvbmVudCxcbiAgICBCbG9ja1Nlcmllc0NvbXBvbmVudCxcbiAgICBCbG9ja0FyZWFTZXJpZXNDb21wb25lbnQsXG4gIF0sXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIExldE1vZHVsZV0sXG59KVxuZXhwb3J0IGNsYXNzIENoYXJ0TW9kdWxlIHtcbn1cbiJdfQ==
|
package/esm2020/public-api.mjs
CHANGED
|
@@ -9,4 +9,5 @@ export * from './chart/legend/legend.component';
|
|
|
9
9
|
export * from './chart/model/public-api';
|
|
10
10
|
export * from './chart/chart-container/series/public-api';
|
|
11
11
|
export * from './chart/core/axis/axis';
|
|
12
|
-
|
|
12
|
+
export * from './chart/core/utils/public-api';
|
|
13
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxzQkFBc0IsQ0FBQztBQUNyQyxjQUFjLDRCQUE0QixDQUFDO0FBQzNDLGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLGlDQUFpQyxDQUFDO0FBQ2hELGNBQWMsMEJBQTBCLENBQUM7QUFDekMsY0FBYywyQ0FBMkMsQ0FBQztBQUMxRCxjQUFjLHdCQUF3QixDQUFDO0FBQ3ZDLGNBQWMsK0JBQStCLENBQUEiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIGNoYXJ0XG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9jaGFydC9jaGFydC5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jaGFydC9zZXJ2aWNlL3B1YmxpYy1hcGknO1xuZXhwb3J0ICogZnJvbSAnLi9jaGFydC9iYXNlL3Nlcmllcy1iYXNlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NoYXJ0L2NoYXJ0L2NoYXJ0LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NoYXJ0L2xlZ2VuZC9sZWdlbmQuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY2hhcnQvbW9kZWwvcHVibGljLWFwaSc7XG5leHBvcnQgKiBmcm9tICcuL2NoYXJ0L2NoYXJ0LWNvbnRhaW5lci9zZXJpZXMvcHVibGljLWFwaSc7XG5leHBvcnQgKiBmcm9tICcuL2NoYXJ0L2NvcmUvYXhpcy9heGlzJztcbmV4cG9ydCAqIGZyb20gJy4vY2hhcnQvY29yZS91dGlscy9wdWJsaWMtYXBpJ1xuIl19
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Component, Input, ChangeDetectionStrategy, ChangeDetectorRef, HostListener, Directive, HostBinding,
|
|
2
|
+
import { Injectable, Component, Input, ChangeDetectionStrategy, ChangeDetectorRef, HostListener, ElementRef, ViewChild, Directive, HostBinding, EventEmitter, Output, NgModule } from '@angular/core';
|
|
3
3
|
import * as i4 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { __awaiter } from 'tslib';
|
|
@@ -9,7 +9,8 @@ import { zoomIdentity } from 'd3';
|
|
|
9
9
|
import objectHash from 'object-hash';
|
|
10
10
|
import { maxIndex } from 'd3-array';
|
|
11
11
|
import { debounceTime, tap as tap$1 } from 'rxjs/operators';
|
|
12
|
-
import
|
|
12
|
+
import * as i5 from '@tetacom/ng-components';
|
|
13
|
+
import { PositionUtil, Align, VerticalAlign, tetaZoneFull, LetModule } from '@tetacom/ng-components';
|
|
13
14
|
import * as i3 from '@angular/platform-browser';
|
|
14
15
|
|
|
15
16
|
var ZoomType;
|
|
@@ -1577,13 +1578,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
|
|
|
1577
1578
|
}] } });
|
|
1578
1579
|
|
|
1579
1580
|
class XAxisComponent {
|
|
1580
|
-
constructor(scaleService) {
|
|
1581
|
+
constructor(scaleService, _svc) {
|
|
1581
1582
|
this.scaleService = scaleService;
|
|
1583
|
+
this._svc = _svc;
|
|
1582
1584
|
this._alive = true;
|
|
1583
1585
|
this.x = this.scaleService.scales.pipe(map((_) => {
|
|
1584
1586
|
var _a;
|
|
1585
1587
|
return (_a = _.x.get(this.axis.index)) === null || _a === void 0 ? void 0 : _a.scale;
|
|
1586
1588
|
}));
|
|
1589
|
+
this.ticks = this.x.pipe(withLatestFrom(this._svc.size), map((_) => {
|
|
1590
|
+
const [x, size] = _;
|
|
1591
|
+
const maxSymbolLength = parseInt(d3.max(x.ticks().map((_) => getTextWidth(this.axis.options.tickFormat ? this.axis.options.tickFormat(_) : this.axis.defaultFormatter()(_)))), 10);
|
|
1592
|
+
return x.ticks(size.width / (maxSymbolLength * 2.5));
|
|
1593
|
+
}));
|
|
1587
1594
|
}
|
|
1588
1595
|
getLabelTransform() {
|
|
1589
1596
|
return `translate(${this.size.width / 2}, ${this.axis.options.opposite ? -32 : 32})`;
|
|
@@ -1593,12 +1600,12 @@ class XAxisComponent {
|
|
|
1593
1600
|
this._alive = false;
|
|
1594
1601
|
}
|
|
1595
1602
|
}
|
|
1596
|
-
XAxisComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, deps: [{ token: ScaleService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1597
|
-
XAxisComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: XAxisComponent, selector: "[teta-x-axis]", inputs: { axis: "axis", size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"x | async as
|
|
1603
|
+
XAxisComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, deps: [{ token: ScaleService }, { token: ChartService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1604
|
+
XAxisComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: XAxisComponent, selector: "[teta-x-axis]", inputs: { axis: "axis", size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"{x: x | async, ticks: ticks | async} as data\">\n <svg:g text-anchor=\"middle\" *ngFor=\"let tick of data.ticks\" [attr.transform]=\"'translate('+ data.x(tick) +', 0)'\">\n <text fill=\"var(--color-text-70)\" [attr.dy]=\"axis.options.opposite ? '-0.71em' : '0.71em'\" [attr.y]=\"axis.options.opposite ? 0 : 9\">{{ this.axis.options.tickFormat ? this.axis.options.tickFormat(tick) : this.axis.defaultFormatter()(tick) }}</text>\n <line stroke=\"var(--color-text-30)\" [attr.y2]=\"axis.options.opposite ? -6 : 6\"></line>\n </svg:g>\n\n <svg:g class=\"label-axis font-caption\" [attr.transform]=\"getLabelTransform()\">\n <text fill=\"var(--color-text-70)\" text-anchor=\"middle\" dominant-baseline=\"middle\">{{ axis.options.title }}</text>\n </svg:g>\n</ng-container>\n\n", styles: [":host .tick{stroke:var(--color-text-20)}\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 });
|
|
1598
1605
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: XAxisComponent, decorators: [{
|
|
1599
1606
|
type: Component,
|
|
1600
|
-
args: [{ selector: '[teta-x-axis]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"x | async as
|
|
1601
|
-
}], ctorParameters: function () { return [{ type: ScaleService }]; }, propDecorators: { axis: [{
|
|
1607
|
+
args: [{ selector: '[teta-x-axis]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{x: x | async, ticks: ticks | async} as data\">\n <svg:g text-anchor=\"middle\" *ngFor=\"let tick of data.ticks\" [attr.transform]=\"'translate('+ data.x(tick) +', 0)'\">\n <text fill=\"var(--color-text-70)\" [attr.dy]=\"axis.options.opposite ? '-0.71em' : '0.71em'\" [attr.y]=\"axis.options.opposite ? 0 : 9\">{{ this.axis.options.tickFormat ? this.axis.options.tickFormat(tick) : this.axis.defaultFormatter()(tick) }}</text>\n <line stroke=\"var(--color-text-30)\" [attr.y2]=\"axis.options.opposite ? -6 : 6\"></line>\n </svg:g>\n\n <svg:g class=\"label-axis font-caption\" [attr.transform]=\"getLabelTransform()\">\n <text fill=\"var(--color-text-70)\" text-anchor=\"middle\" dominant-baseline=\"middle\">{{ axis.options.title }}</text>\n </svg:g>\n</ng-container>\n\n", styles: [":host .tick{stroke:var(--color-text-20)}\n"] }]
|
|
1608
|
+
}], ctorParameters: function () { return [{ type: ScaleService }, { type: ChartService }]; }, propDecorators: { axis: [{
|
|
1602
1609
|
type: Input
|
|
1603
1610
|
}], size: [{
|
|
1604
1611
|
type: Input
|
|
@@ -1859,12 +1866,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
|
|
|
1859
1866
|
}] } });
|
|
1860
1867
|
|
|
1861
1868
|
class TooltipComponent {
|
|
1862
|
-
constructor(svc, cdr, zoomService, sanitizer, _zone) {
|
|
1869
|
+
constructor(svc, cdr, zoomService, sanitizer, _zone, _elementRef) {
|
|
1863
1870
|
this.svc = svc;
|
|
1864
1871
|
this.cdr = cdr;
|
|
1865
1872
|
this.zoomService = zoomService;
|
|
1866
1873
|
this.sanitizer = sanitizer;
|
|
1867
1874
|
this._zone = _zone;
|
|
1875
|
+
this._elementRef = _elementRef;
|
|
1868
1876
|
this.tooltips = this.svc.tooltips.pipe(map((_) => [..._.values()]));
|
|
1869
1877
|
}
|
|
1870
1878
|
ngOnInit() {
|
|
@@ -1912,20 +1920,15 @@ class TooltipComponent {
|
|
|
1912
1920
|
}
|
|
1913
1921
|
getPosition(event) {
|
|
1914
1922
|
var _a, _b;
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
1922
|
-
|
|
1923
|
-
|
|
1924
|
-
right: event.pageX > centerX
|
|
1925
|
-
? `${window.innerWidth - event.pageX + padding.x}px`
|
|
1926
|
-
: 'initial',
|
|
1927
|
-
};
|
|
1928
|
-
return scene;
|
|
1923
|
+
if (!this.tooltip) {
|
|
1924
|
+
return null;
|
|
1925
|
+
}
|
|
1926
|
+
return PositionUtil.getPosition({
|
|
1927
|
+
top: event.pageY,
|
|
1928
|
+
bottom: event.pageY,
|
|
1929
|
+
left: event.pageX,
|
|
1930
|
+
right: event.pageX,
|
|
1931
|
+
}, (_b = (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.nativeElement) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect(), Align.auto, VerticalAlign.top, 12);
|
|
1929
1932
|
}
|
|
1930
1933
|
format(input) {
|
|
1931
1934
|
if (input instanceof Date) {
|
|
@@ -1936,15 +1939,18 @@ class TooltipComponent {
|
|
|
1936
1939
|
return format(input);
|
|
1937
1940
|
}
|
|
1938
1941
|
}
|
|
1939
|
-
TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ZoomService }, { token: i3.DomSanitizer }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
1940
|
-
TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: TooltipComponent, selector: "teta-tooltip", inputs: { size: "size", config: "config" }, ngImport: i0, template: "<ng-container *
|
|
1942
|
+
TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ZoomService }, { token: i3.DomSanitizer }, { token: i0.NgZone }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1943
|
+
TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: TooltipComponent, selector: "teta-tooltip", inputs: { size: "size", config: "config" }, viewQueries: [{ propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container *tetaLet=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n #tooltip\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left.px]=\"p?.left\"\n [style.top.px]=\"p?.top\"\n [style.bottom.px]=\"p?.bottom\"\n [style.right.px]=\"p?.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\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: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.LetDirective, selector: "[tetaLet]", inputs: ["tetaLet"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1941
1944
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, decorators: [{
|
|
1942
1945
|
type: Component,
|
|
1943
|
-
args: [{ selector: 'teta-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *
|
|
1944
|
-
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ZoomService }, { type: i3.DomSanitizer }, { type: i0.NgZone }]; }, propDecorators: { size: [{
|
|
1946
|
+
args: [{ selector: 'teta-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *tetaLet=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n #tooltip\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left.px]=\"p?.left\"\n [style.top.px]=\"p?.top\"\n [style.bottom.px]=\"p?.bottom\"\n [style.right.px]=\"p?.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\n"] }]
|
|
1947
|
+
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ZoomService }, { type: i3.DomSanitizer }, { type: i0.NgZone }, { type: i0.ElementRef }]; }, propDecorators: { size: [{
|
|
1945
1948
|
type: Input
|
|
1946
1949
|
}], config: [{
|
|
1947
1950
|
type: Input
|
|
1951
|
+
}], tooltip: [{
|
|
1952
|
+
type: ViewChild,
|
|
1953
|
+
args: ['tooltip', { static: false, read: ElementRef }]
|
|
1948
1954
|
}] } });
|
|
1949
1955
|
|
|
1950
1956
|
class ZoomableDirective {
|
|
@@ -2404,9 +2410,9 @@ class ChartContainerComponent {
|
|
|
2404
2410
|
refCount: true,
|
|
2405
2411
|
}));
|
|
2406
2412
|
this.brushScale = this._scaleService.scales.pipe(withLatestFrom(this.config), map((data) => {
|
|
2407
|
-
var _a, _b;
|
|
2413
|
+
var _a, _b, _c, _d;
|
|
2408
2414
|
const [{ x, y }, config] = data;
|
|
2409
|
-
return ((_a = config.brush) === null || _a === void 0 ? void 0 : _a.type) === BrushType.x || ((_b = config === null || config === void 0 ? void 0 : config.zoom) === null || _b === void 0 ? void 0 : _b.type) === ZoomType.x ? x.get(0).scale : y.get(0).scale;
|
|
2415
|
+
return ((_a = config.brush) === null || _a === void 0 ? void 0 : _a.type) === BrushType.x || ((_b = config === null || config === void 0 ? void 0 : config.zoom) === null || _b === void 0 ? void 0 : _b.type) === ZoomType.x ? (_c = x.get(0)) === null || _c === void 0 ? void 0 : _c.scale : (_d = y.get(0)) === null || _d === void 0 ? void 0 : _d.scale;
|
|
2410
2416
|
}), shareReplay({
|
|
2411
2417
|
bufferSize: 1,
|
|
2412
2418
|
refCount: true,
|
|
@@ -2534,10 +2540,10 @@ class ChartContainerComponent {
|
|
|
2534
2540
|
}
|
|
2535
2541
|
}
|
|
2536
2542
|
ChartContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartContainerComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ScaleService }, { token: ZoomService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
2537
|
-
ChartContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ChartContainerComponent, selector: "teta-chart-container", ngImport: i0, template: "<ng-container *ngIf=\"{\n size: size | async,\n config: config | async,\n scales: scales | async,\n visibleRect: visibleRect | async,\n brushScale: brushScale | async\n} as data\" xmlns:svg=\"http://www.w3.org/1999/html\">\n <teta-tooltip *ngIf=\"data.config?.tooltip?.enable\"\n [size]=\"data.size\"\n [config]=\"data.config\"></teta-tooltip>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x && data.scales.y\">\n <svg height=\"100%\" width=\"100%\" class=\"position-absolute\">\n <g class=\"y-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.y | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible\">\n <g\n teta-y-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.y.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"item.value.options.opposite ? 0 : -item.value.selfSize\"\n [attr.y]=\"0\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.width]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n\n </ng-container>\n </g>\n <g class=\"x-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.x | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible && data.scales.x && data.scales.y\">\n <g\n teta-x-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.x.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"0\"\n [attr.y]=\"item.value.options.opposite ? -item.value.selfSize : 0\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n </ng-container>\n </g>\n </svg>\n </ng-container>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x && data.scales.y\">\n <svg\n tetaBrushable\n tetaZoomable\n class=\"position-absolute\"\n [size]=\"data.visibleRect\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.brushScale\"\n [config]=\"data.config\"\n [axis]=\"data.config?.zoom?.type === zoomType.x ? data.scales.x.get(0) : data.scales.y.get(0)\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.viewBox]=\"'0 0 ' + data.visibleRect.width + ' ' + data.visibleRect.height\"\n [style.transform]=\"'translate('+ data.visibleRect.x +'px, '+ data.visibleRect.y +'px)'\"\n (contextmenu)=\"contextMenu($event, data.scales.x, data.scales.y)\"\n (click)=\"click($event, data.scales.x, data.scales.y)\"\n (mouseleave)=\"mouseLeave($event)\"\n (mousemove)=\"mouseMove($event)\">\n\n <g class=\"gridlines\"\n teta-gridlines\n *ngIf=\"data.config.gridLines?.enable !== false\"\n [size]=\"data.size\"></g>\n\n <g class=\"x-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.y.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"x-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"series-container\">\n <ng-container *ngFor=\"let series of data.config.series\">\n <g teta-series-host\n *ngIf=\"series.visible\"\n [config]=\"data.config\"\n [series]=\"series\"></g>\n </ng-container>\n </g>\n <g class=\"annotations\">\n <g teta-annotation\n *ngFor=\"let annotation of data.config.annotations\"\n [annotation]=\"annotation\"></g>\n </g>\n <g class=\"crosshair\" *ngIf=\"data.config.tooltip?.showCrosshair\">\n <g teta-crosshair [size]=\"data.visibleRect\"></g>\n </g>\n </svg>\n\n </ng-container>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-width:0;min-height:0}:host .zoomable:hover{cursor:grab}:host .zoomable:active{cursor:grabbing}:host .crosshair{cursor:crosshair}\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: "component", type: SeriesHostComponent, selector: "[teta-series-host]", inputs: ["config", "series"] }, { kind: "component", type: GridlinesComponent, selector: "[teta-gridlines]", inputs: ["size"] }, { kind: "component", type: XAxisComponent, selector: "[teta-x-axis]", inputs: ["axis", "size"] }, { kind: "component", type: YAxisComponent, selector: "[teta-y-axis]", inputs: ["axis", "size"] }, { kind: "component", type: PlotlineComponent, selector: "[teta-plot-line]", inputs: ["plotLine", "size", "axis", "scale"] }, { kind: "component", type: PlotBandComponent, selector: "[teta-plot-band]", inputs: ["plotBand", "axis", "scale", "size"] }, { kind: "component", type: TooltipComponent, selector: "teta-tooltip", inputs: ["size", "config"] }, { kind: "directive", type: ZoomableDirective, selector: "[tetaZoomable]", inputs: ["config", "axis", "size", "brushScale", "scale"] }, { kind: "directive", type: BrushableDirective, selector: "[tetaBrushable]", inputs: ["config", "brushScale"] }, { kind: "component", type: AnnotationComponent, selector: "[teta-annotation]", inputs: ["annotation"] }, { kind: "component", type: CrosshairComponent, selector: "[teta-crosshair]", inputs: ["size"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2543
|
+
ChartContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ChartContainerComponent, selector: "teta-chart-container", ngImport: i0, template: "<ng-container *ngIf=\"{\n size: size | async,\n config: config | async,\n scales: scales | async,\n visibleRect: visibleRect | async,\n brushScale: brushScale | async\n} as data\" xmlns:svg=\"http://www.w3.org/1999/html\">\n <teta-tooltip *ngIf=\"data.config?.tooltip?.enable\"\n [size]=\"data.size\"\n [config]=\"data.config\"></teta-tooltip>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <svg height=\"100%\" width=\"100%\" class=\"position-absolute\">\n <g class=\"y-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.y | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible\">\n <g\n teta-y-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.y.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"item.value.options.opposite ? 0 : -item.value.selfSize\"\n [attr.y]=\"0\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.width]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n\n </ng-container>\n </g>\n <g class=\"x-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.x | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <g\n teta-x-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.x.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"0\"\n [attr.y]=\"item.value.options.opposite ? -item.value.selfSize : 0\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n </ng-container>\n </g>\n </svg>\n </ng-container>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <svg\n tetaBrushable\n tetaZoomable\n class=\"position-absolute\"\n [size]=\"data.visibleRect\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.brushScale\"\n [config]=\"data.config\"\n [axis]=\"data.config?.zoom?.type === zoomType.x ? data.scales.x.get(0) : data.scales.y.get(0)\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.viewBox]=\"'0 0 ' + data.visibleRect.width + ' ' + data.visibleRect.height\"\n [style.transform]=\"'translate('+ data.visibleRect.x +'px, '+ data.visibleRect.y +'px)'\"\n (contextmenu)=\"contextMenu($event, data.scales.x, data.scales.y)\"\n (click)=\"click($event, data.scales.x, data.scales.y)\"\n (mouseleave)=\"mouseLeave($event)\"\n (mousemove)=\"mouseMove($event)\">\n\n <g class=\"gridlines\"\n teta-gridlines\n *ngIf=\"data.config.gridLines?.enable !== false\"\n [size]=\"data.size\"></g>\n\n <g class=\"x-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.y.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"x-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"series-container\">\n <ng-container *ngFor=\"let series of data.config.series\">\n <g teta-series-host\n *ngIf=\"series.visible\"\n [config]=\"data.config\"\n [series]=\"series\"></g>\n </ng-container>\n </g>\n <g class=\"annotations\">\n <g teta-annotation\n *ngFor=\"let annotation of data.config.annotations\"\n [annotation]=\"annotation\"></g>\n </g>\n <g class=\"crosshair\" *ngIf=\"data.config.tooltip?.showCrosshair\">\n <g teta-crosshair [size]=\"data.visibleRect\"></g>\n </g>\n </svg>\n\n </ng-container>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-width:0;min-height:0}:host .zoomable:hover{cursor:grab}:host .zoomable:active{cursor:grabbing}:host .crosshair{cursor:crosshair}\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: "component", type: SeriesHostComponent, selector: "[teta-series-host]", inputs: ["config", "series"] }, { kind: "component", type: GridlinesComponent, selector: "[teta-gridlines]", inputs: ["size"] }, { kind: "component", type: XAxisComponent, selector: "[teta-x-axis]", inputs: ["axis", "size"] }, { kind: "component", type: YAxisComponent, selector: "[teta-y-axis]", inputs: ["axis", "size"] }, { kind: "component", type: PlotlineComponent, selector: "[teta-plot-line]", inputs: ["plotLine", "size", "axis", "scale"] }, { kind: "component", type: PlotBandComponent, selector: "[teta-plot-band]", inputs: ["plotBand", "axis", "scale", "size"] }, { kind: "component", type: TooltipComponent, selector: "teta-tooltip", inputs: ["size", "config"] }, { kind: "directive", type: ZoomableDirective, selector: "[tetaZoomable]", inputs: ["config", "axis", "size", "brushScale", "scale"] }, { kind: "directive", type: BrushableDirective, selector: "[tetaBrushable]", inputs: ["config", "brushScale"] }, { kind: "component", type: AnnotationComponent, selector: "[teta-annotation]", inputs: ["annotation"] }, { kind: "component", type: CrosshairComponent, selector: "[teta-crosshair]", inputs: ["size"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2538
2544
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartContainerComponent, decorators: [{
|
|
2539
2545
|
type: Component,
|
|
2540
|
-
args: [{ selector: 'teta-chart-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n size: size | async,\n config: config | async,\n scales: scales | async,\n visibleRect: visibleRect | async,\n brushScale: brushScale | async\n} as data\" xmlns:svg=\"http://www.w3.org/1999/html\">\n <teta-tooltip *ngIf=\"data.config?.tooltip?.enable\"\n [size]=\"data.size\"\n [config]=\"data.config\"></teta-tooltip>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x && data.scales.y\">\n <svg height=\"100%\" width=\"100%\" class=\"position-absolute\">\n <g class=\"y-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.y | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible\">\n <g\n teta-y-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.y.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"item.value.options.opposite ? 0 : -item.value.selfSize\"\n [attr.y]=\"0\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.width]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n\n </ng-container>\n </g>\n <g class=\"x-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.x | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible && data.scales.x && data.scales.y\">\n <g\n teta-x-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.x.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"0\"\n [attr.y]=\"item.value.options.opposite ? -item.value.selfSize : 0\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n </ng-container>\n </g>\n </svg>\n </ng-container>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x && data.scales.y\">\n <svg\n tetaBrushable\n tetaZoomable\n class=\"position-absolute\"\n [size]=\"data.visibleRect\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.brushScale\"\n [config]=\"data.config\"\n [axis]=\"data.config?.zoom?.type === zoomType.x ? data.scales.x.get(0) : data.scales.y.get(0)\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.viewBox]=\"'0 0 ' + data.visibleRect.width + ' ' + data.visibleRect.height\"\n [style.transform]=\"'translate('+ data.visibleRect.x +'px, '+ data.visibleRect.y +'px)'\"\n (contextmenu)=\"contextMenu($event, data.scales.x, data.scales.y)\"\n (click)=\"click($event, data.scales.x, data.scales.y)\"\n (mouseleave)=\"mouseLeave($event)\"\n (mousemove)=\"mouseMove($event)\">\n\n <g class=\"gridlines\"\n teta-gridlines\n *ngIf=\"data.config.gridLines?.enable !== false\"\n [size]=\"data.size\"></g>\n\n <g class=\"x-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.y.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"x-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"series-container\">\n <ng-container *ngFor=\"let series of data.config.series\">\n <g teta-series-host\n *ngIf=\"series.visible\"\n [config]=\"data.config\"\n [series]=\"series\"></g>\n </ng-container>\n </g>\n <g class=\"annotations\">\n <g teta-annotation\n *ngFor=\"let annotation of data.config.annotations\"\n [annotation]=\"annotation\"></g>\n </g>\n <g class=\"crosshair\" *ngIf=\"data.config.tooltip?.showCrosshair\">\n <g teta-crosshair [size]=\"data.visibleRect\"></g>\n </g>\n </svg>\n\n </ng-container>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-width:0;min-height:0}:host .zoomable:hover{cursor:grab}:host .zoomable:active{cursor:grabbing}:host .crosshair{cursor:crosshair}\n"] }]
|
|
2546
|
+
args: [{ selector: 'teta-chart-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n size: size | async,\n config: config | async,\n scales: scales | async,\n visibleRect: visibleRect | async,\n brushScale: brushScale | async\n} as data\" xmlns:svg=\"http://www.w3.org/1999/html\">\n <teta-tooltip *ngIf=\"data.config?.tooltip?.enable\"\n [size]=\"data.size\"\n [config]=\"data.config\"></teta-tooltip>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <svg height=\"100%\" width=\"100%\" class=\"position-absolute\">\n <g class=\"y-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.y | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible\">\n <g\n teta-y-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.y.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"item.value.options.opposite ? 0 : -item.value.selfSize\"\n [attr.y]=\"0\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.width]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n\n </ng-container>\n </g>\n <g class=\"x-axis-container\">\n <ng-container *ngFor=\"let item of data.scales.x | keyvalue; trackBy: identify\">\n <ng-container *ngIf=\"item.value.options.visible && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <g\n teta-x-axis\n [axis]=\"item.value\"\n [size]=\"data.visibleRect\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></g>\n <rect\n tetaZoomable\n fill-opacity=\"0\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.scales.x.get(item.key).scale\"\n [axis]=\"item.value\"\n [config]=\"data.config\"\n [size]=\"data.visibleRect\"\n [attr.x]=\"0\"\n [attr.y]=\"item.value.options.opposite ? -item.value.selfSize : 0\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"item.value.selfSize\"\n [attr.transform]=\"getTranslate(item.value, data.size) | async\"></rect>\n </ng-container>\n </ng-container>\n </g>\n </svg>\n </ng-container>\n <ng-container *ngIf=\"data.visibleRect?.width > 0 && data.visibleRect?.height > 0 && data.scales.x.size > 0 && data.scales.y.size > 0\">\n <svg\n tetaBrushable\n tetaZoomable\n class=\"position-absolute\"\n [size]=\"data.visibleRect\"\n [brushScale]=\"data.brushScale\"\n [scale]=\"data.brushScale\"\n [config]=\"data.config\"\n [axis]=\"data.config?.zoom?.type === zoomType.x ? data.scales.x.get(0) : data.scales.y.get(0)\"\n [attr.width]=\"data.visibleRect.width\"\n [attr.height]=\"data.visibleRect.height\"\n [attr.viewBox]=\"'0 0 ' + data.visibleRect.width + ' ' + data.visibleRect.height\"\n [style.transform]=\"'translate('+ data.visibleRect.x +'px, '+ data.visibleRect.y +'px)'\"\n (contextmenu)=\"contextMenu($event, data.scales.x, data.scales.y)\"\n (click)=\"click($event, data.scales.x, data.scales.y)\"\n (mouseleave)=\"mouseLeave($event)\"\n (mousemove)=\"mouseMove($event)\">\n\n <g class=\"gridlines\"\n teta-gridlines\n *ngIf=\"data.config.gridLines?.enable !== false\"\n [size]=\"data.size\"></g>\n\n <g class=\"x-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotband-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-band *ngFor=\"let plotBand of axis.plotBands\"\n [plotBand]=\"plotBand\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.y.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"x-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.xAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.x.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"y-axis-plotline-container\">\n <ng-container *ngFor=\"let axis of data.config.yAxis; let i = index\">\n <g teta-plot-line *ngFor=\"let plotLine of axis.plotLines\"\n [plotLine]=\"plotLine\"\n [scale]=\"data.scales.y.get(i).scale\"\n [size]=\"data.size\"\n [axis]=\"data.scales.x.get(i)\"></g>\n </ng-container>\n </g>\n <g class=\"series-container\">\n <ng-container *ngFor=\"let series of data.config.series\">\n <g teta-series-host\n *ngIf=\"series.visible\"\n [config]=\"data.config\"\n [series]=\"series\"></g>\n </ng-container>\n </g>\n <g class=\"annotations\">\n <g teta-annotation\n *ngFor=\"let annotation of data.config.annotations\"\n [annotation]=\"annotation\"></g>\n </g>\n <g class=\"crosshair\" *ngIf=\"data.config.tooltip?.showCrosshair\">\n <g teta-crosshair [size]=\"data.visibleRect\"></g>\n </g>\n </svg>\n\n </ng-container>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-width:0;min-height:0}:host .zoomable:hover{cursor:grab}:host .zoomable:active{cursor:grabbing}:host .crosshair{cursor:crosshair}\n"] }]
|
|
2541
2547
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ScaleService }, { type: ZoomService }, { type: i0.ElementRef }, { type: i0.NgZone }]; } });
|
|
2542
2548
|
|
|
2543
2549
|
class LegendComponent {
|
|
@@ -2687,10 +2693,10 @@ class ChartComponent {
|
|
|
2687
2693
|
}
|
|
2688
2694
|
}
|
|
2689
2695
|
ChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartComponent, deps: [{ token: ChartService }, { token: ZoomService }, { token: ScaleService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2690
|
-
ChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ChartComponent, selector: "teta-svg-chart", inputs: { config: "config" }, outputs: { pointerMove: "pointerMove", plotBandsMove: "plotBandsMove", plotBandClick: "plotBandClick", plotBandContextMenu: "plotBandContextMenu", plotLinesMove: "plotLinesMove", pointMove: "pointMove", chartClick: "chartClick", chartContextMenu: "chartContextMenu", annotationContextMenu: "annotationContextMenu", annotationClick: "annotationClick", annotationMove: "annotationMove", zoomServiceInstance: "zoomServiceInstance" }, providers: [ChartService, ZoomService, ScaleService, BrushService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n hasSeriesData: hasSeriesData | async,\n svcConfig: svcConfig | async\n} as data\">\n <ng-container *ngIf=\"data.hasSeriesData === true else noData\">\n <div class=\"column column_auto\">\n <teta-chart-container class=\"chart-container position-relative\"></teta-chart-container>\n </div>\n <teta-legend *ngIf=\"data.svcConfig.legend?.enable === true\" [series]=\"data.svcConfig.series\"></teta-legend>\n </ng-container>\n</ng-container>\n<ng-template #noData>\n <div class=\"column column_auto
|
|
2696
|
+
ChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ChartComponent, selector: "teta-svg-chart", inputs: { config: "config" }, outputs: { pointerMove: "pointerMove", plotBandsMove: "plotBandsMove", plotBandClick: "plotBandClick", plotBandContextMenu: "plotBandContextMenu", plotLinesMove: "plotLinesMove", pointMove: "pointMove", chartClick: "chartClick", chartContextMenu: "chartContextMenu", annotationContextMenu: "annotationContextMenu", annotationClick: "annotationClick", annotationMove: "annotationMove", zoomServiceInstance: "zoomServiceInstance" }, providers: [ChartService, ZoomService, ScaleService, BrushService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"{\n hasSeriesData: hasSeriesData | async,\n svcConfig: svcConfig | async\n} as data\">\n <ng-container *ngIf=\"data.hasSeriesData === true else noData\">\n <div class=\"column column_auto\">\n <teta-chart-container class=\"chart-container position-relative\"></teta-chart-container>\n </div>\n <teta-legend *ngIf=\"data.svcConfig.legend?.enable === true\" [series]=\"data.svcConfig.series\"></teta-legend>\n </ng-container>\n</ng-container>\n<ng-template #noData>\n <div class=\"column column_auto justify-content-center\">\n <span class=\"font-body-3 color-text-40\" style=\"overflow: hidden; text-overflow: ellipsis; text-align: center; white-space: nowrap\">\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044E\u0442</span>\n </div>\n</ng-template>\n", styles: [":host{position:relative;display:flex;flex-direction:column;height:100%;width:100%}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChartContainerComponent, selector: "teta-chart-container" }, { kind: "component", type: LegendComponent, selector: "teta-legend", inputs: ["series"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2691
2697
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartComponent, decorators: [{
|
|
2692
2698
|
type: Component,
|
|
2693
|
-
args: [{ selector: 'teta-svg-chart', providers: [ChartService, ZoomService, ScaleService, BrushService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n hasSeriesData: hasSeriesData | async,\n svcConfig: svcConfig | async\n} as data\">\n <ng-container *ngIf=\"data.hasSeriesData === true else noData\">\n <div class=\"column column_auto\">\n <teta-chart-container class=\"chart-container position-relative\"></teta-chart-container>\n </div>\n <teta-legend *ngIf=\"data.svcConfig.legend?.enable === true\" [series]=\"data.svcConfig.series\"></teta-legend>\n </ng-container>\n</ng-container>\n<ng-template #noData>\n <div class=\"column column_auto
|
|
2699
|
+
args: [{ selector: 'teta-svg-chart', providers: [ChartService, ZoomService, ScaleService, BrushService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n hasSeriesData: hasSeriesData | async,\n svcConfig: svcConfig | async\n} as data\">\n <ng-container *ngIf=\"data.hasSeriesData === true else noData\">\n <div class=\"column column_auto\">\n <teta-chart-container class=\"chart-container position-relative\"></teta-chart-container>\n </div>\n <teta-legend *ngIf=\"data.svcConfig.legend?.enable === true\" [series]=\"data.svcConfig.series\"></teta-legend>\n </ng-container>\n</ng-container>\n<ng-template #noData>\n <div class=\"column column_auto justify-content-center\">\n <span class=\"font-body-3 color-text-40\" style=\"overflow: hidden; text-overflow: ellipsis; text-align: center; white-space: nowrap\">\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044E\u0442</span>\n </div>\n</ng-template>\n", styles: [":host{position:relative;display:flex;flex-direction:column;height:100%;width:100%}\n"] }]
|
|
2694
2700
|
}], ctorParameters: function () { return [{ type: ChartService }, { type: ZoomService }, { type: ScaleService }]; }, propDecorators: { pointerMove: [{
|
|
2695
2701
|
type: Output
|
|
2696
2702
|
}], plotBandsMove: [{
|
|
@@ -2743,7 +2749,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
2743
2749
|
BlockSeriesComponent,
|
|
2744
2750
|
BlockAreaSeriesComponent,
|
|
2745
2751
|
AnnotationComponent,
|
|
2746
|
-
CrosshairComponent], imports: [CommonModule], exports: [ChartComponent,
|
|
2752
|
+
CrosshairComponent], imports: [CommonModule, LetModule], exports: [ChartComponent,
|
|
2747
2753
|
LegendComponent,
|
|
2748
2754
|
SeriesBaseComponent,
|
|
2749
2755
|
LineSeriesComponent,
|
|
@@ -2752,7 +2758,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
2752
2758
|
AreaSeriesComponent,
|
|
2753
2759
|
BlockSeriesComponent,
|
|
2754
2760
|
BlockAreaSeriesComponent] });
|
|
2755
|
-
ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule] });
|
|
2761
|
+
ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule, LetModule] });
|
|
2756
2762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, decorators: [{
|
|
2757
2763
|
type: NgModule,
|
|
2758
2764
|
args: [{
|
|
@@ -2791,7 +2797,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
|
|
|
2791
2797
|
BlockSeriesComponent,
|
|
2792
2798
|
BlockAreaSeriesComponent,
|
|
2793
2799
|
],
|
|
2794
|
-
imports: [CommonModule],
|
|
2800
|
+
imports: [CommonModule, LetModule],
|
|
2795
2801
|
}]
|
|
2796
2802
|
}] });
|
|
2797
2803
|
|
|
@@ -2833,5 +2839,5 @@ class PlotLine {
|
|
|
2833
2839
|
* Generated bundle index. Do not edit.
|
|
2834
2840
|
*/
|
|
2835
2841
|
|
|
2836
|
-
export { AreaSeriesComponent, Axis, AxisOrientation, BarSeriesComponent, BlockAreaSeriesComponent, BlockSeriesComponent, BroadcastService, BrushMessage, BrushService, BrushType, ChartBounds, ChartComponent, ChartModule, ChartService, ClipPointsDirection, DragPointType, FillDirection, FillType, LegendComponent, LineSeriesComponent, PlotBand, PlotLine, ScaleService, ScaleType, ScatterSeriesComponent, SeriesBaseComponent, SeriesType, TooltipTracking, ZoomBehaviorType, ZoomMessage, ZoomService, ZoomType };
|
|
2842
|
+
export { AreaSeriesComponent, Axis, AxisOrientation, BarSeriesComponent, BlockAreaSeriesComponent, BlockSeriesComponent, BroadcastService, BrushMessage, BrushService, BrushType, ChartBounds, ChartComponent, ChartModule, ChartService, ClipPointsDirection, DragPointType, FillDirection, FillType, LegendComponent, LineSeriesComponent, PlotBand, PlotLine, ScaleService, ScaleType, ScatterSeriesComponent, SeriesBaseComponent, SeriesType, TooltipTracking, ZoomBehaviorType, ZoomMessage, ZoomService, ZoomType, generateTicks, getTextWidth };
|
|
2837
2843
|
//# sourceMappingURL=tetacom-svg-charts.mjs.map
|