@siemens/maps-ng 48.11.1 → 48.11.3
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/fesm2022/siemens-maps-ng.mjs +10 -25
- package/fesm2022/siemens-maps-ng.mjs.map +1 -1
- package/index.d.ts +4 -5
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
2
|
+
import { input, signal, inject, ElementRef, Component, Directive, viewChild, ViewContainerRef, TemplateRef, Injectable, model, output, contentChild, computed, NgZone, Injector, HostListener, ChangeDetectionStrategy, NgModule } from '@angular/core';
|
|
3
3
|
import { t, SiTranslatePipe, SiTranslateServiceBuilder, SiNoTranslateService } from '@siemens/element-translate-ng/translate';
|
|
4
4
|
import AnimatedCluster from 'ol-ext/layer/AnimatedCluster';
|
|
5
5
|
import Chart from 'ol-ext/style/Chart';
|
|
@@ -63,7 +63,6 @@ const LAYER_NAME = 'layerName';
|
|
|
63
63
|
* SPDX-License-Identifier: MIT
|
|
64
64
|
*/
|
|
65
65
|
class SiMapTooltipComponent {
|
|
66
|
-
content = viewChild.required('content');
|
|
67
66
|
/**
|
|
68
67
|
* Cutoff text for tooltips, when cluster combines more than 4 features
|
|
69
68
|
*
|
|
@@ -83,6 +82,7 @@ class SiMapTooltipComponent {
|
|
|
83
82
|
return this.elementRef.nativeElement;
|
|
84
83
|
}
|
|
85
84
|
hiddenEntries = signal(0);
|
|
85
|
+
tooltipLabels = signal([]);
|
|
86
86
|
elementRef = inject(ElementRef);
|
|
87
87
|
/**
|
|
88
88
|
* Method sets tooltip content. If parameter is of type
|
|
@@ -92,37 +92,22 @@ class SiMapTooltipComponent {
|
|
|
92
92
|
* @param labels - array of strings or string itself
|
|
93
93
|
*/
|
|
94
94
|
setTooltip(labels) {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
return;
|
|
99
|
-
}
|
|
100
|
-
const list = [];
|
|
101
|
-
if (labels.length > 1) {
|
|
102
|
-
const toDisplay = [...labels];
|
|
103
|
-
const rest = toDisplay.splice(TOOLTIP_FEATURES_TO_DISPLAY, toDisplay.length - TOOLTIP_FEATURES_TO_DISPLAY);
|
|
104
|
-
toDisplay.forEach(feat => list.push(this.getLabelSnippet(feat)));
|
|
105
|
-
this.hiddenEntries.set(rest.length ?? 0);
|
|
106
|
-
}
|
|
107
|
-
this.setContent(list.join(''));
|
|
95
|
+
const labelList = typeof labels === 'string' ? [labels] : labels.length > 1 ? labels : [];
|
|
96
|
+
this.tooltipLabels.set(labelList.slice(0, TOOLTIP_FEATURES_TO_DISPLAY).map(label => this.getLabelText(label)));
|
|
97
|
+
this.hiddenEntries.set(Math.max(labelList.length - TOOLTIP_FEATURES_TO_DISPLAY, 0));
|
|
108
98
|
}
|
|
109
|
-
|
|
99
|
+
getLabelText(label) {
|
|
110
100
|
if (this.maxLabelLength() != -1 && label.length > this.maxLabelLength()) {
|
|
111
|
-
return
|
|
101
|
+
return `${label.substring(0, this.maxLabelLength())}…`;
|
|
112
102
|
}
|
|
113
|
-
|
|
114
|
-
return `<div>${label}</div>`;
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
setContent(tooltip) {
|
|
118
|
-
this.content().nativeElement.innerHTML = tooltip;
|
|
103
|
+
return label;
|
|
119
104
|
}
|
|
120
105
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiMapTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
121
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiMapTooltipComponent, isStandalone: true, selector: "si-map-tooltip", inputs: { moreText: { classPropertyName: "moreText", publicName: "moreText", isSignal: true, isRequired: false, transformFunction: null }, maxLabelLength: { classPropertyName: "maxLabelLength", publicName: "maxLabelLength", isSignal: true, isRequired: false, transformFunction: null } },
|
|
106
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SiMapTooltipComponent, isStandalone: true, selector: "si-map-tooltip", inputs: { moreText: { classPropertyName: "moreText", publicName: "moreText", isSignal: true, isRequired: false, transformFunction: null }, maxLabelLength: { classPropertyName: "maxLabelLength", publicName: "maxLabelLength", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"si-map-tooltip\">\n @for (label of tooltipLabels(); track $index) {\n <div>{{ label }}</div>\n }\n @if (hiddenEntries()) {\n <div>{{ moreText() | translate: { length: hiddenEntries() } }}</div>\n }\n</div>\n", styles: [".si-map-tooltip{text-align:start;margin-block-start:4px;position:relative;max-inline-size:max-content;padding-block:4px;padding-inline:8px;color:var(--element-ui-5);background-color:var(--element-ui-1);border-radius:var(--element-radius-1)}.si-map-tooltip:before{content:\"\";position:absolute;inset-block-start:-4px;left:50%;transform:translate(-50%) rotate(45deg);block-size:8px;inline-size:8px;background-color:inherit}\n"], dependencies: [{ kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
|
|
122
107
|
}
|
|
123
108
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: SiMapTooltipComponent, decorators: [{
|
|
124
109
|
type: Component,
|
|
125
|
-
args: [{ selector: 'si-map-tooltip', imports: [SiTranslatePipe], template: "<div class=\"si-map-tooltip\">\n <div
|
|
110
|
+
args: [{ selector: 'si-map-tooltip', imports: [SiTranslatePipe], template: "<div class=\"si-map-tooltip\">\n @for (label of tooltipLabels(); track $index) {\n <div>{{ label }}</div>\n }\n @if (hiddenEntries()) {\n <div>{{ moreText() | translate: { length: hiddenEntries() } }}</div>\n }\n</div>\n", styles: [".si-map-tooltip{text-align:start;margin-block-start:4px;position:relative;max-inline-size:max-content;padding-block:4px;padding-inline:8px;color:var(--element-ui-5);background-color:var(--element-ui-1);border-radius:var(--element-radius-1)}.si-map-tooltip:before{content:\"\";position:absolute;inset-block-start:-4px;left:50%;transform:translate(-50%) rotate(45deg);block-size:8px;inline-size:8px;background-color:inherit}\n"] }]
|
|
126
111
|
}] });
|
|
127
112
|
|
|
128
113
|
/**
|