@siemens/maps-ng 49.13.0 → 51.0.0-rc.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/README.md +2 -2
- package/fesm2022/siemens-maps-ng.mjs +111 -2982
- package/fesm2022/siemens-maps-ng.mjs.map +1 -1
- package/package.json +11 -8
- package/types/siemens-maps-ng.d.ts +2 -15
- package/projects/maps-ng/README.md +0 -117
- /package/{LICENSE.md → LICENSE} +0 -0
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@siemens/maps-ng",
|
|
3
3
|
"description": "Element maps library based on OpenLayers.",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "51.0.0-rc.3",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -12,19 +12,21 @@
|
|
|
12
12
|
"email": "info@siemens.com"
|
|
13
13
|
},
|
|
14
14
|
"publishConfig": {
|
|
15
|
-
"access": "public"
|
|
15
|
+
"access": "public",
|
|
16
|
+
"directory": "../../dist/@siemens/maps-ng"
|
|
16
17
|
},
|
|
17
18
|
"homepage": "https://github.com/siemens/element",
|
|
18
19
|
"bugs": "https://github.com/siemens/element/issues/new",
|
|
19
20
|
"type": "module",
|
|
20
21
|
"peerDependencies": {
|
|
21
|
-
"@angular/common": "
|
|
22
|
-
"@angular/core": "
|
|
23
|
-
"@siemens/element-translate-ng": "49.13.0",
|
|
24
|
-
"@siemens/element-theme": "49.13.0",
|
|
22
|
+
"@angular/common": "22",
|
|
23
|
+
"@angular/core": "22",
|
|
25
24
|
"ol": "~10.6.0 || ~10.7.0 || ~10.8.0 || ~10.9.0",
|
|
26
25
|
"ol-ext": "^4.0.24",
|
|
27
|
-
"ol-mapbox-style": "^13.1.0"
|
|
26
|
+
"ol-mapbox-style": "^13.1.0",
|
|
27
|
+
"@siemens/element-theme": "51.0.0-rc.3",
|
|
28
|
+
"@siemens/map-styles": "51.0.0-rc.3",
|
|
29
|
+
"@siemens/element-translate-ng": "51.0.0-rc.3"
|
|
28
30
|
},
|
|
29
31
|
"exports": {
|
|
30
32
|
"./docs.json": {
|
|
@@ -47,5 +49,6 @@
|
|
|
47
49
|
"sideEffects": false,
|
|
48
50
|
"dependencies": {
|
|
49
51
|
"tslib": "^2.3.0"
|
|
50
|
-
}
|
|
52
|
+
},
|
|
53
|
+
"readme": "# Element Maps\n\nElement maps library based on OpenLayers.\n\n## Usage\n\nTo use this library in other projects, add it to your dependencies using:\n\n```sh\nnpm install --save @siemens/maps-ng\n\n# Also install the needed peer dependencies\nnpm install --save ol@~10.2.0 ol-ext ol-mapbox-style\n```\n\nAdd library assets and CommonJs dependencies in your _angular.json_ under the build options\n\n```json\n{\n \"architect\": {\n \"build\": {\n \"options\": {\n \"assets\": [\n // ... other assets\n {\n \"glob\": \"**/*\",\n \"input\": \"./node_modules/@siemens/maps-ng/assets\",\n \"output\": \"/assets/\"\n }\n ],\n // ... other options\n \"allowedCommonJsDependencies\": [\n \"xml-utils/find-tags-by-name.js\",\n \"xml-utils/get-attribute.js\",\n \"web-worker\",\n \"pbf\",\n \"earcut\",\n \"rbush\"\n ]\n }\n }\n }\n}\n```\n\nImport openlayers styles into your main global stylesheet\n\n```scss\n@use 'ol/ol.css';\n```\n\nAdd the library to the list of _imports_ in your Angular _AppModule_ like this:\n\n```ts\n// [...]\n\n// Import this library and required dependencies\nimport { SiMapModule } from '@siemens/maps-ng';\n\n@NgModule({\n declarations: [AppComponent],\n imports: [\n BrowserModule,\n\n // Import this library\n SiMapModule\n ],\n bootstrap: [AppComponent]\n})\nexport class AppModule {}\n```\n\nOr simply _import_ the `SiMapComponent` in your standalone component.\n\n```ts\n@Component({\n selector: 'app-map',\n imports: [SiMapComponent],\n templateUrl: './sample.component.html',\n host: { class: 'h-100' }\n})\nexport class SampleComponent {}\n```\n\nAnd lastly, add the map to your template and add a MapTiler key.\nNote, the map has not height per default and comes with a `block`\ndisplay. Set the height or put it in a related container.\n\nThe demo key works on localhost. It will be renewed regularly\nto avoid missuses of the key. Contact the SiMPL team to receive\na key for your SI BP product.\n\n```html\n<si-map [maptilerKey]=\"'REPLACE_WITH_YOUR_MAPTILER_KEY'\" style=\"height: 500px;\"></si-map>\n```\n\n### Testing\n\nDo **not** load map data (tiles) from maptiler in automated tests, to reduce the number of\npayed requests to a minimum. E.g. during testing, you want to test your functions and not the\ntile data provided by maptiler.\n\n- **Unit tests:** Do simply **not** provide an API key during\n- **Playwright tests:** Stub the `tiles.json` request (and some others) using [page.route(...)](playwright/e2e/simpl-element/maps/static.spec.ts).\n\n### Running Unit Tests\n\nRun `pnpm run maps:test` to perform the unit tests via [Vitest](https://main.vitest.dev/).\n\n## License\n\nThe following applies for code and documentation of the git repository,\nunless explicitly mentioned.\n\nCopyright (c) Siemens 2016 - 2026\n\nMIT, see [LICENSE](LICENSE).\n"
|
|
51
54
|
}
|
|
@@ -167,8 +167,6 @@ declare const DEFAULT_FEATURE_CLICK_ZOOM = 15;
|
|
|
167
167
|
declare const DEFAULT_CLUSTER_CLICK_ZOOM = 15;
|
|
168
168
|
declare const DEFAULT_GLOBAL_ZOOM = 5;
|
|
169
169
|
declare const DEFAULT_CLUSTER_DISTANCE = 40;
|
|
170
|
-
/** @deprecated will be removed in favour of individual inputs. */
|
|
171
|
-
declare const DEFAULT_FIT_PADDING: number[];
|
|
172
170
|
/** Updates the amount of buildings to be shown in a cluster tooltip after hovering over it */
|
|
173
171
|
declare const TOOLTIP_FEATURES_TO_DISPLAY = 4;
|
|
174
172
|
/** Specifies the maximum amount of buildings allowed to be displayed as a number in a cluster */
|
|
@@ -499,17 +497,6 @@ declare class SiMapComponent implements AfterViewInit, OnChanges, OnDestroy, Aft
|
|
|
499
497
|
* @defaultValue [20, 20, 20, 20]
|
|
500
498
|
*/
|
|
501
499
|
readonly fitGeoJsonPadding: _angular_core.InputSignal<number[]>;
|
|
502
|
-
/**
|
|
503
|
-
* Cutoff text for tooltips, when cluster combines more than 4 features
|
|
504
|
-
*
|
|
505
|
-
* @deprecated Use `SiMapTooltipComponent` instead to set the `moreText` input e.g. `<si-map ...><si-map-tooltip [moreText]="'KEY_MORE'" /></si-map>`.
|
|
506
|
-
*
|
|
507
|
-
* @defaultValue
|
|
508
|
-
* ```
|
|
509
|
-
* t(() => $localize`:@@SI_MAPS.TOOLTIP_MORE_TEXT:and {{length}} more...`)
|
|
510
|
-
* ```
|
|
511
|
-
*/
|
|
512
|
-
readonly moreText: _angular_core.InputSignal<_siemens_element_translate_ng_translate.TranslatableString>;
|
|
513
500
|
/**
|
|
514
501
|
* Show multiple worlds, including points that cross the 180th meridian.
|
|
515
502
|
*
|
|
@@ -708,7 +695,7 @@ declare class SiMapComponent implements AfterViewInit, OnChanges, OnDestroy, Aft
|
|
|
708
695
|
private calculateClusterCoordinates;
|
|
709
696
|
private showClusterPopover;
|
|
710
697
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SiMapComponent, never>;
|
|
711
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiMapComponent, "si-map", never, { "points": { "alias": "points"; "required": false; "isSignal": true; }; "geoJson": { "alias": "geoJson"; "required": false; "isSignal": true; }; "styleFunction": { "alias": "styleFunction"; "required": false; "isSignal": true; }; "geoJsonProjection": { "alias": "geoJsonProjection"; "required": false; "isSignal": true; }; "markerAnimation": { "alias": "markerAnimation"; "required": false; "isSignal": true; }; "cluster": { "alias": "cluster"; "required": false; "isSignal": true; }; "groupColors": { "alias": "groupColors"; "required": false; "isSignal": true; }; "nativeProperties": { "alias": "nativeProperties"; "required": false; "isSignal": true; }; "styleJson": { "alias": "styleJson"; "required": false; "isSignal": true; }; "displayTooltipOnHover": { "alias": "displayTooltipOnHover"; "required": false; "isSignal": true; }; "displayPopoverOnClick": { "alias": "displayPopoverOnClick"; "required": false; "isSignal": true; }; "displayPopoverOnHover": { "alias": "displayPopoverOnHover"; "required": false; "isSignal": true; }; "maptilerKey": { "alias": "maptilerKey"; "required": false; "isSignal": true; }; "displayTooltipOnClusterHover": { "alias": "displayTooltipOnClusterHover"; "required": false; "isSignal": true; }; "clusterDistance": { "alias": "clusterDistance"; "required": false; "isSignal": true; }; "featureSelectZoom": { "alias": "featureSelectZoom"; "required": false; "isSignal": true; }; "featureClickZoom": { "alias": "featureClickZoom"; "required": false; "isSignal": true; }; "clusterClickZoom": { "alias": "clusterClickZoom"; "required": false; "isSignal": true; }; "globalZoom": { "alias": "globalZoom"; "required": false; "isSignal": true; }; "autoZoomFeatureClick": { "alias": "autoZoomFeatureClick"; "required": false; "isSignal": true; }; "autoZoomClusterClick": { "alias": "autoZoomClusterClick"; "required": false; "isSignal": true; }; "popoverComponent": { "alias": "popoverComponent"; "required": false; "isSignal": true; }; "clusterPopoverComponent": { "alias": "clusterPopoverComponent"; "required": false; "isSignal": true; }; "popoverComponentProps": { "alias": "popoverComponentProps"; "required": false; "isSignal": true; }; "popoverCloseOnClick": { "alias": "popoverCloseOnClick"; "required": false; "isSignal": true; }; "fitClusterPadding": { "alias": "fitClusterPadding"; "required": false; "isSignal": true; }; "fitPointPadding": { "alias": "fitPointPadding"; "required": false; "isSignal": true; }; "fitGeoJsonPadding": { "alias": "fitGeoJsonPadding"; "required": false; "isSignal": true; }; "
|
|
698
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SiMapComponent, "si-map", never, { "points": { "alias": "points"; "required": false; "isSignal": true; }; "geoJson": { "alias": "geoJson"; "required": false; "isSignal": true; }; "styleFunction": { "alias": "styleFunction"; "required": false; "isSignal": true; }; "geoJsonProjection": { "alias": "geoJsonProjection"; "required": false; "isSignal": true; }; "markerAnimation": { "alias": "markerAnimation"; "required": false; "isSignal": true; }; "cluster": { "alias": "cluster"; "required": false; "isSignal": true; }; "groupColors": { "alias": "groupColors"; "required": false; "isSignal": true; }; "nativeProperties": { "alias": "nativeProperties"; "required": false; "isSignal": true; }; "styleJson": { "alias": "styleJson"; "required": false; "isSignal": true; }; "displayTooltipOnHover": { "alias": "displayTooltipOnHover"; "required": false; "isSignal": true; }; "displayPopoverOnClick": { "alias": "displayPopoverOnClick"; "required": false; "isSignal": true; }; "displayPopoverOnHover": { "alias": "displayPopoverOnHover"; "required": false; "isSignal": true; }; "maptilerKey": { "alias": "maptilerKey"; "required": false; "isSignal": true; }; "displayTooltipOnClusterHover": { "alias": "displayTooltipOnClusterHover"; "required": false; "isSignal": true; }; "clusterDistance": { "alias": "clusterDistance"; "required": false; "isSignal": true; }; "featureSelectZoom": { "alias": "featureSelectZoom"; "required": false; "isSignal": true; }; "featureClickZoom": { "alias": "featureClickZoom"; "required": false; "isSignal": true; }; "clusterClickZoom": { "alias": "clusterClickZoom"; "required": false; "isSignal": true; }; "globalZoom": { "alias": "globalZoom"; "required": false; "isSignal": true; }; "autoZoomFeatureClick": { "alias": "autoZoomFeatureClick"; "required": false; "isSignal": true; }; "autoZoomClusterClick": { "alias": "autoZoomClusterClick"; "required": false; "isSignal": true; }; "popoverComponent": { "alias": "popoverComponent"; "required": false; "isSignal": true; }; "clusterPopoverComponent": { "alias": "clusterPopoverComponent"; "required": false; "isSignal": true; }; "popoverComponentProps": { "alias": "popoverComponentProps"; "required": false; "isSignal": true; }; "popoverCloseOnClick": { "alias": "popoverCloseOnClick"; "required": false; "isSignal": true; }; "fitClusterPadding": { "alias": "fitClusterPadding"; "required": false; "isSignal": true; }; "fitPointPadding": { "alias": "fitPointPadding"; "required": false; "isSignal": true; }; "fitGeoJsonPadding": { "alias": "fitGeoJsonPadding"; "required": false; "isSignal": true; }; "multiWorld": { "alias": "multiWorld"; "required": false; "isSignal": true; }; "alwaysShowLabels": { "alias": "alwaysShowLabels"; "required": false; "isSignal": true; }; "maxLabelLineLength": { "alias": "maxLabelLineLength"; "required": false; "isSignal": true; }; "maxLabelLines": { "alias": "maxLabelLines"; "required": false; "isSignal": true; }; }, { "points": "pointsChange"; "pointsSelected": "pointsSelected"; "pointsRefreshed": "pointsRefreshed"; }, ["projectedTooltip"], ["si-map-tooltip"], true, never>;
|
|
712
699
|
}
|
|
713
700
|
|
|
714
701
|
declare class SiMapModule {
|
|
@@ -723,5 +710,5 @@ declare class SiMapsNgModule {
|
|
|
723
710
|
static ɵinj: _angular_core.ɵɵInjectorDeclaration<SiMapsNgModule>;
|
|
724
711
|
}
|
|
725
712
|
|
|
726
|
-
export { ANIMATION_DURATION, CLUSTER_CHARTS_FRAGMENTS, CLUSTER_RADIUS_SIZE, DEFAULT_CLUSTER_CLICK_ZOOM, DEFAULT_CLUSTER_DISTANCE, DEFAULT_CLUSTER_TYPE, DEFAULT_DONUT_RATIO, DEFAULT_FEATURE_CLICK_ZOOM, DEFAULT_FEATURE_SELECT_ZOOM,
|
|
713
|
+
export { ANIMATION_DURATION, CLUSTER_CHARTS_FRAGMENTS, CLUSTER_RADIUS_SIZE, DEFAULT_CLUSTER_CLICK_ZOOM, DEFAULT_CLUSTER_DISTANCE, DEFAULT_CLUSTER_TYPE, DEFAULT_DONUT_RATIO, DEFAULT_FEATURE_CLICK_ZOOM, DEFAULT_FEATURE_SELECT_ZOOM, DEFAULT_GLOBAL_ZOOM, DEFAULT_ICON, DEFAULT_ICON_SCALE, DEFAULT_OFFSET, DEFAULT_STROKE_WEIGHT, GEOJSON_LAYER, Grouping, LAYER_NAME, MAX_CLUSTER_BUILDINGS, MapService, POINTS_LAYER, SIEMENS_FONT, SIEMENS_FONT_LABELS, SiMapComponent, SiMapModule, SiMapPopoverComponent, SiMapTooltipComponent, SiMapsNgModule, SiMapsNgModule as SimplMapsNgModule, TOOLTIP_FEATURES_TO_DISPLAY };
|
|
727
714
|
export type { ColorPalette, ColorPalettes, IconMarkerOptions, LabelOptions, MapPoint, MapPointMetaData, MarkerOptions, MarkerStatusType, OverlayNativeProperties, RenderOptions };
|
|
@@ -1,117 +0,0 @@
|
|
|
1
|
-
# Element Maps
|
|
2
|
-
|
|
3
|
-
Element maps library based on OpenLayers.
|
|
4
|
-
|
|
5
|
-
## Usage
|
|
6
|
-
|
|
7
|
-
To use this library in other projects, add it to your dependencies using:
|
|
8
|
-
|
|
9
|
-
```sh
|
|
10
|
-
npm install --save @siemens/maps-ng
|
|
11
|
-
|
|
12
|
-
# Also install the needed peer dependencies
|
|
13
|
-
npm install --save ol@~10.2.0 ol-ext ol-mapbox-style
|
|
14
|
-
```
|
|
15
|
-
|
|
16
|
-
Add library assets and CommonJs dependencies in your _angular.json_ under the build options
|
|
17
|
-
|
|
18
|
-
```json
|
|
19
|
-
{
|
|
20
|
-
"architect": {
|
|
21
|
-
"build": {
|
|
22
|
-
"options": {
|
|
23
|
-
"assets": [
|
|
24
|
-
// ... other assets
|
|
25
|
-
{
|
|
26
|
-
"glob": "**/*",
|
|
27
|
-
"input": "./node_modules/@siemens/maps-ng/assets",
|
|
28
|
-
"output": "/assets/"
|
|
29
|
-
}
|
|
30
|
-
],
|
|
31
|
-
// ... other options
|
|
32
|
-
"allowedCommonJsDependencies": [
|
|
33
|
-
"xml-utils/find-tags-by-name.js",
|
|
34
|
-
"xml-utils/get-attribute.js",
|
|
35
|
-
"web-worker",
|
|
36
|
-
"pbf",
|
|
37
|
-
"earcut",
|
|
38
|
-
"rbush"
|
|
39
|
-
]
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
Import openlayers styles into your main global stylesheet
|
|
47
|
-
|
|
48
|
-
```scss
|
|
49
|
-
@use 'ol/ol.css';
|
|
50
|
-
```
|
|
51
|
-
|
|
52
|
-
Add the library to the list of _imports_ in your Angular _AppModule_ like this:
|
|
53
|
-
|
|
54
|
-
```ts
|
|
55
|
-
// [...]
|
|
56
|
-
|
|
57
|
-
// Import this library and required dependencies
|
|
58
|
-
import { SiMapModule } from '@siemens/maps-ng';
|
|
59
|
-
|
|
60
|
-
@NgModule({
|
|
61
|
-
declarations: [AppComponent],
|
|
62
|
-
imports: [
|
|
63
|
-
BrowserModule,
|
|
64
|
-
|
|
65
|
-
// Import this library
|
|
66
|
-
SiMapModule
|
|
67
|
-
],
|
|
68
|
-
bootstrap: [AppComponent]
|
|
69
|
-
})
|
|
70
|
-
export class AppModule {}
|
|
71
|
-
```
|
|
72
|
-
|
|
73
|
-
Or simply _import_ the `SiMapComponent` in your standalone component.
|
|
74
|
-
|
|
75
|
-
```ts
|
|
76
|
-
@Component({
|
|
77
|
-
selector: 'app-map',
|
|
78
|
-
imports: [SiMapComponent],
|
|
79
|
-
templateUrl: './sample.component.html',
|
|
80
|
-
host: { class: 'h-100' }
|
|
81
|
-
})
|
|
82
|
-
export class SampleComponent {}
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
And lastly, add the map to your template and add a MapTiler key.
|
|
86
|
-
Note, the map has not height per default and comes with a `block`
|
|
87
|
-
display. Set the height or put it in a related container.
|
|
88
|
-
|
|
89
|
-
The demo key works on localhost. It will be renewed regularly
|
|
90
|
-
to avoid missuses of the key. Contact the SiMPL team to receive
|
|
91
|
-
a key for your SI BP product.
|
|
92
|
-
|
|
93
|
-
```html
|
|
94
|
-
<si-map [maptilerKey]="'REPLACE_WITH_YOUR_MAPTILER_KEY'" style="height: 500px;"></si-map>
|
|
95
|
-
```
|
|
96
|
-
|
|
97
|
-
### Testing
|
|
98
|
-
|
|
99
|
-
Do **not** load map data (tiles) from maptiler in automated tests, to reduce the number of
|
|
100
|
-
payed requests to a minimum. E.g. during testing, you want to test your functions and not the
|
|
101
|
-
tile data provided by maptiler.
|
|
102
|
-
|
|
103
|
-
- **Unit tests:** Do simply **not** provide an API key during
|
|
104
|
-
- **Playwright tests:** Stub the `tiles.json` request (and some others) using [page.route(...)](playwright/e2e/simpl-element/maps/static.spec.ts).
|
|
105
|
-
|
|
106
|
-
### Running Unit Tests
|
|
107
|
-
|
|
108
|
-
Run `npm run maps:test` to perform the unit tests via [Vitest](https://main.vitest.dev/).
|
|
109
|
-
|
|
110
|
-
## License
|
|
111
|
-
|
|
112
|
-
The following applies for code and documentation of the git repository,
|
|
113
|
-
unless explicitly mentioned.
|
|
114
|
-
|
|
115
|
-
Copyright (c) Siemens 2016 - 2026
|
|
116
|
-
|
|
117
|
-
MIT, see [LICENSE.md](LICENSE.md).
|
/package/{LICENSE.md → LICENSE}
RENAMED
|
File without changes
|