@geospatial-sdk/openlayers 0.0.5-dev.16 → 0.0.5-dev.18

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.
@@ -1 +1 @@
1
- {"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,cAAc,EAEf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,GAAG,MAAM,QAAQ,CAAC;AACzB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,gBAAgB,CAAC;AA0BnC,wBAAsB,WAAW,CAAC,UAAU,EAAE,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,CAqL7E;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,CAyBpE;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAC5B,OAAO,CAAC,GAAG,CAAC,CAKd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CAQd"}
1
+ {"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,cAAc,EAEf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,GAAG,MAAM,QAAQ,CAAC;AACzB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,gBAAgB,CAAC;AA0BnC,wBAAsB,WAAW,CAAC,UAAU,EAAE,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,CAwL7E;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,CAyBpE;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAC5B,OAAO,CAAC,GAAG,CAAC,CAKd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CAQd"}
@@ -45,7 +45,7 @@ export function createLayer(layerModel) {
45
45
  layer = new TileLayer({
46
46
  source: new TileWMS({
47
47
  url: removeSearchParams(layerModel.url, ["request", "service"]),
48
- params: { LAYERS: layerModel.name },
48
+ params: Object.assign({ LAYERS: layerModel.name }, (layerModel.style && { STYLES: layerModel.style })),
49
49
  gutter: 20,
50
50
  attributions: layerModel.attributions,
51
51
  }),
@@ -1,4 +1,5 @@
1
1
  export * from "./styles";
2
2
  export { createMapFromContext, resetMapFromContext } from "./create-map";
3
3
  export { applyContextDiffToMap } from "./apply-context-diff";
4
+ export { listen } from "./register-events";
4
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/map/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/map/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC"}
package/dist/map/index.js CHANGED
@@ -1,3 +1,4 @@
1
1
  export * from "./styles";
2
2
  export { createMapFromContext, resetMapFromContext } from "./create-map";
3
3
  export { applyContextDiffToMap } from "./apply-context-diff";
4
+ export { listen } from "./register-events";
@@ -0,0 +1,12 @@
1
+ import Map from "ol/Map";
2
+ import { MapEventsByType } from "@geospatial-sdk/core";
3
+ import { Coordinate } from "ol/coordinate";
4
+ import TileWMS from "ol/source/TileWMS";
5
+ import ImageWMS from "ol/source/ImageWMS";
6
+ import { Pixel } from "ol/pixel";
7
+ import type { Feature } from "geojson";
8
+ export declare function getFeaturesFromVectorSources(olMap: Map, pixel: Pixel): Feature[];
9
+ export declare function getGFIUrl(source: TileWMS | ImageWMS, map: Map, coordinate: Coordinate): string | null;
10
+ export declare function getFeaturesFromWmsSources(olMap: Map, coordinate: Coordinate): Promise<Feature[]>;
11
+ export declare function listen<T extends keyof MapEventsByType>(map: Map, eventType: T, callback: (event: MapEventsByType[T]) => void): void;
12
+ //# sourceMappingURL=register-events.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"register-events.d.ts","sourceRoot":"","sources":["../../lib/map/register-events.ts"],"names":[],"mappings":"AAAA,OAAO,GAA4B,MAAM,QAAQ,CAAC;AAClD,OAAO,EAIL,eAAe,EAChB,MAAM,sBAAsB,CAAC;AAM9B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,OAAO,MAAM,mBAAmB,CAAC;AACxC,OAAO,QAAQ,MAAM,oBAAoB,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,KAAK,EAAE,OAAO,EAAqB,MAAM,SAAS,CAAC;AAK1D,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,GAAG,EACV,KAAK,EAAE,KAAK,GACX,OAAO,EAAE,CAOX;AAED,wBAAgB,SAAS,CACvB,MAAM,EAAE,OAAO,GAAG,QAAQ,EAC1B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,GACrB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,GAAG,EACV,UAAU,EAAE,UAAU,GACrB,OAAO,CAAC,OAAO,EAAE,CAAC,CA2BpB;AAyCD,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,eAAe,EACpD,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAAI,QAgC9C"}
@@ -0,0 +1,114 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ import { FeaturesClickEventType, FeaturesHoverEventType, MapClickEventType, } from "@geospatial-sdk/core";
11
+ import { toLonLat } from "ol/proj";
12
+ import GeoJSON from "ol/format/GeoJSON";
13
+ import TileWMS from "ol/source/TileWMS";
14
+ import ImageWMS from "ol/source/ImageWMS";
15
+ import Layer from "ol/layer/Layer";
16
+ import throttle from "lodash.throttle";
17
+ const GEOJSON = new GeoJSON();
18
+ export function getFeaturesFromVectorSources(olMap, pixel) {
19
+ const olFeatures = olMap.getFeaturesAtPixel(pixel);
20
+ const { features } = GEOJSON.writeFeaturesObject(olFeatures);
21
+ if (!features) {
22
+ return [];
23
+ }
24
+ return features;
25
+ }
26
+ export function getGFIUrl(source, map, coordinate) {
27
+ var _a;
28
+ const view = map.getView();
29
+ const projection = view.getProjection();
30
+ const resolution = view.getResolution();
31
+ const params = Object.assign(Object.assign({}, source.getParams()), { INFO_FORMAT: "application/json" });
32
+ return ((_a = source.getFeatureInfoUrl(coordinate, resolution, projection, params)) !== null && _a !== void 0 ? _a : null);
33
+ }
34
+ export function getFeaturesFromWmsSources(olMap, coordinate) {
35
+ const wmsSources = olMap
36
+ .getLayers()
37
+ .getArray()
38
+ .filter((layer) => layer instanceof Layer &&
39
+ (layer.getSource() instanceof TileWMS ||
40
+ layer.getSource() instanceof ImageWMS))
41
+ .map((layer) => layer.getSource());
42
+ if (!wmsSources.length) {
43
+ return Promise.resolve([]);
44
+ }
45
+ const gfiUrls = wmsSources.reduce((urls, source) => {
46
+ const gfiUrl = getGFIUrl(source, olMap, coordinate);
47
+ return gfiUrl ? [...urls, gfiUrl] : urls;
48
+ }, []);
49
+ return Promise.all(gfiUrls.map((url) => fetch(url)
50
+ .then((response) => response.json())
51
+ .then((collection) => collection.features))).then((features) => features.flat());
52
+ }
53
+ const getFeaturesFromWmsSourcesThrottled = throttle(getFeaturesFromWmsSources, 250);
54
+ function readFeaturesAtPixel(map, event) {
55
+ return __awaiter(this, void 0, void 0, function* () {
56
+ return [
57
+ ...getFeaturesFromVectorSources(map, event.pixel),
58
+ ...(yield getFeaturesFromWmsSourcesThrottled(map, event.coordinate)),
59
+ ];
60
+ });
61
+ }
62
+ function registerFeatureClickEvent(map) {
63
+ if (map.get(FeaturesClickEventType))
64
+ return;
65
+ map.on("click", (event) => __awaiter(this, void 0, void 0, function* () {
66
+ const features = yield readFeaturesAtPixel(map, event);
67
+ map.dispatchEvent({
68
+ type: FeaturesClickEventType,
69
+ features,
70
+ });
71
+ }));
72
+ map.set(FeaturesClickEventType, true);
73
+ }
74
+ function registerFeatureHoverEvent(map) {
75
+ if (map.get(FeaturesHoverEventType))
76
+ return;
77
+ map.on("pointermove", (event) => __awaiter(this, void 0, void 0, function* () {
78
+ const features = yield readFeaturesAtPixel(map, event);
79
+ map.dispatchEvent({
80
+ type: FeaturesHoverEventType,
81
+ features,
82
+ });
83
+ }));
84
+ map.set(FeaturesHoverEventType, true);
85
+ }
86
+ export function listen(map, eventType, callback) {
87
+ switch (eventType) {
88
+ case FeaturesClickEventType:
89
+ registerFeatureClickEvent(map);
90
+ // we're using a custom event type here so we need to cast to unknown first
91
+ map.on(eventType, (event) => {
92
+ callback(event);
93
+ });
94
+ break;
95
+ case FeaturesHoverEventType:
96
+ registerFeatureHoverEvent(map);
97
+ // see comment above
98
+ map.on(eventType, (event) => {
99
+ callback(event);
100
+ });
101
+ break;
102
+ case MapClickEventType:
103
+ map.on("click", (event) => {
104
+ const coordinate = toLonLat(event.pixel, map.getView().getProjection());
105
+ callback({
106
+ type: "map-click",
107
+ coordinate,
108
+ });
109
+ });
110
+ break;
111
+ default:
112
+ throw new Error(`Unrecognized event type: ${eventType}`);
113
+ }
114
+ }
@@ -119,6 +119,7 @@ describe("MapContextService", () => {
119
119
  const source = layer.getSource() as TileWMS;
120
120
  const params = source.getParams();
121
121
  expect(params.LAYERS).toBe((layerModel as MapContextLayerWms).name);
122
+ expect(params.STYLES).toBe((layerModel as MapContextLayerWms).style);
122
123
  });
123
124
  it("set correct url without existing REQUEST and SERVICE params", () => {
124
125
  const source = layer.getSource() as TileWMS;
@@ -49,7 +49,10 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
49
49
  layer = new TileLayer({
50
50
  source: new TileWMS({
51
51
  url: removeSearchParams(layerModel.url, ["request", "service"]),
52
- params: { LAYERS: layerModel.name },
52
+ params: {
53
+ LAYERS: layerModel.name,
54
+ ...(layerModel.style && { STYLES: layerModel.style }),
55
+ },
53
56
  gutter: 20,
54
57
  attributions: layerModel.attributions,
55
58
  }),
package/lib/map/index.ts CHANGED
@@ -1,3 +1,4 @@
1
1
  export * from "./styles";
2
2
  export { createMapFromContext, resetMapFromContext } from "./create-map";
3
3
  export { applyContextDiffToMap } from "./apply-context-diff";
4
+ export { listen } from "./register-events";
@@ -0,0 +1,199 @@
1
+ import Map from "ol/Map";
2
+ import { Mock } from "vitest";
3
+ import {
4
+ getFeaturesFromVectorSources,
5
+ getFeaturesFromWmsSources,
6
+ getGFIUrl,
7
+ listen,
8
+ } from "./register-events";
9
+ import { Collection, MapBrowserEvent, Object as BaseObject } from "ol";
10
+ import View from "ol/View";
11
+ import { toLonLat } from "ol/proj";
12
+ import TileWMS from "ol/source/TileWMS";
13
+ import VectorSource from "ol/source/Vector";
14
+ import VectorLayer from "ol/layer/Vector";
15
+ import Point from "ol/geom/Point";
16
+ import TileLayer from "ol/layer/Tile";
17
+ import OlFeature from "ol/Feature";
18
+
19
+ const gfiResult = {
20
+ type: "Feature",
21
+ properties: {
22
+ density: 123,
23
+ },
24
+ geometry: null,
25
+ };
26
+ function createWmsSource() {
27
+ return new TileWMS({
28
+ url: "http://my.service.org/wms?SERVICE=WMS",
29
+ params: {
30
+ LAYERS: "layerName",
31
+ FORMAT: "image/png",
32
+ TRANSPARENT: true,
33
+ },
34
+ });
35
+ }
36
+ function createMap(): Map {
37
+ const wmsLayer = new TileLayer({
38
+ source: createWmsSource(),
39
+ });
40
+ const feature = new OlFeature({
41
+ geometry: new Point([100, 200]),
42
+ });
43
+ const vectorLayer = new VectorLayer({
44
+ source: new VectorSource({
45
+ features: [feature],
46
+ }),
47
+ });
48
+ const view = new View({
49
+ projection: "EPSG:3857",
50
+ resolution: 1,
51
+ center: [0, 0],
52
+ });
53
+ const map = new BaseObject() as Map;
54
+ Object.defineProperties(map, {
55
+ getView: { value: vi.fn(() => view) },
56
+ getLayers: { value: vi.fn(() => new Collection([wmsLayer, vectorLayer])) },
57
+ getEventPixel: { value: vi.fn(() => [10, 10]) },
58
+ getCoordinateFromPixel: { value: vi.fn(() => [123, 123]) },
59
+ getFeaturesAtPixel: { value: vi.fn(() => [feature]) },
60
+ });
61
+ return map;
62
+ }
63
+ function createMapEvent(map: Map, type: string) {
64
+ return new MapBrowserEvent(
65
+ type,
66
+ map,
67
+ new MouseEvent(type, {
68
+ clientX: 10,
69
+ clientY: 10,
70
+ }),
71
+ false,
72
+ );
73
+ }
74
+
75
+ describe("event registration", () => {
76
+ let map: Map;
77
+ beforeEach(() => {
78
+ map = createMap();
79
+ vi.spyOn(global, "fetch").mockImplementation(() =>
80
+ Promise.resolve({
81
+ ok: true,
82
+ json: () => Promise.resolve({ features: [gfiResult] }),
83
+ } as Response),
84
+ );
85
+ vi.useFakeTimers();
86
+ });
87
+ describe("getFeaturesFromVectorSources", () => {
88
+ it("returns an array of features", () => {
89
+ const features = getFeaturesFromVectorSources(map, [0, 0]);
90
+ expect(features).toEqual([
91
+ {
92
+ geometry: {
93
+ coordinates: [100, 200],
94
+ type: "Point",
95
+ },
96
+ properties: null,
97
+ type: "Feature",
98
+ },
99
+ ]);
100
+ });
101
+ });
102
+ describe("getGFIUrl", () => {
103
+ let url: string;
104
+ const coordinate = [-182932.49329334166, 6125319.813853541];
105
+ beforeEach(() => {
106
+ const wmsSource = createWmsSource();
107
+ url = getGFIUrl(wmsSource, map, coordinate) as string;
108
+ });
109
+ it("returns true", () => {
110
+ expect(url).toEqual(
111
+ "http://my.service.org/wms?SERVICE=WMS&REQUEST=GetFeatureInfo&QUERY_LAYERS=layerName&SERVICE=WMS&VERSION=1.3.0&FORMAT=image%2Fpng&STYLES=&TRANSPARENT=true&LAYERS=layerName&INFO_FORMAT=application%2Fjson&I=176&J=31&WIDTH=256&HEIGHT=256&CRS=EPSG%3A3857&BBOX=-183143.11977128312%2C6125051.950547744%2C-182837.37165814242%2C6125357.698660884",
112
+ );
113
+ });
114
+ });
115
+ describe("getFeaturesFromWmsSources", () => {
116
+ it("queries the WMS sources", async () => {
117
+ const features = await getFeaturesFromWmsSources(map, [0, 0]);
118
+ expect(features).toEqual([gfiResult]);
119
+ });
120
+ });
121
+ describe("features hover event", () => {
122
+ let callback: Mock;
123
+ beforeEach(async () => {
124
+ callback = vi.fn();
125
+ listen(map, "features-hover", callback);
126
+ map.dispatchEvent(createMapEvent(map, "pointermove"));
127
+ await vi.runAllTimersAsync();
128
+ });
129
+ it("registers the event on the map", () => {
130
+ expect(callback).toHaveBeenCalledWith({
131
+ type: "features-hover",
132
+ features: [
133
+ {
134
+ geometry: {
135
+ coordinates: [100, 200],
136
+ type: "Point",
137
+ },
138
+ properties: null,
139
+ type: "Feature",
140
+ },
141
+ {
142
+ geometry: null,
143
+ properties: {
144
+ density: 123,
145
+ },
146
+ type: "Feature",
147
+ },
148
+ ],
149
+ target: expect.anything(),
150
+ });
151
+ });
152
+ });
153
+ describe("features click event", () => {
154
+ let callback: Mock;
155
+ beforeEach(async () => {
156
+ callback = vi.fn();
157
+ listen(map, "features-click", callback);
158
+ map.dispatchEvent(createMapEvent(map, "click"));
159
+ await vi.runAllTimersAsync();
160
+ });
161
+ it("registers the event on the map", () => {
162
+ expect(callback).toHaveBeenCalledWith({
163
+ type: "features-click",
164
+ features: [
165
+ {
166
+ geometry: {
167
+ coordinates: [100, 200],
168
+ type: "Point",
169
+ },
170
+ properties: null,
171
+ type: "Feature",
172
+ },
173
+ {
174
+ geometry: null,
175
+ properties: {
176
+ density: 123,
177
+ },
178
+ type: "Feature",
179
+ },
180
+ ],
181
+ target: expect.anything(),
182
+ });
183
+ });
184
+ });
185
+ describe("map click event", () => {
186
+ let callback: Mock;
187
+ beforeEach(() => {
188
+ callback = vi.fn();
189
+ listen(map, "map-click", callback);
190
+ map.dispatchEvent(createMapEvent(map, "click"));
191
+ });
192
+ it("registers the event on the map", () => {
193
+ expect(callback).toHaveBeenCalledWith({
194
+ coordinate: toLonLat([10, 10]),
195
+ type: "map-click",
196
+ });
197
+ });
198
+ });
199
+ });
@@ -0,0 +1,158 @@
1
+ import Map, { MapObjectEventTypes } from "ol/Map";
2
+ import {
3
+ FeaturesClickEventType,
4
+ FeaturesHoverEventType,
5
+ MapClickEventType,
6
+ MapEventsByType,
7
+ } from "@geospatial-sdk/core";
8
+ import { toLonLat } from "ol/proj";
9
+ import GeoJSON from "ol/format/GeoJSON";
10
+ import OlFeature from "ol/Feature";
11
+ import BaseEvent from "ol/events/Event";
12
+ import { MapBrowserEvent } from "ol";
13
+ import { Coordinate } from "ol/coordinate";
14
+ import TileWMS from "ol/source/TileWMS";
15
+ import ImageWMS from "ol/source/ImageWMS";
16
+ import Layer from "ol/layer/Layer";
17
+ import { Pixel } from "ol/pixel";
18
+ import type { Feature, FeatureCollection } from "geojson";
19
+ import throttle from "lodash.throttle";
20
+
21
+ const GEOJSON = new GeoJSON();
22
+
23
+ export function getFeaturesFromVectorSources(
24
+ olMap: Map,
25
+ pixel: Pixel,
26
+ ): Feature[] {
27
+ const olFeatures = olMap.getFeaturesAtPixel(pixel);
28
+ const { features } = GEOJSON.writeFeaturesObject(olFeatures as OlFeature[]);
29
+ if (!features) {
30
+ return [];
31
+ }
32
+ return features;
33
+ }
34
+
35
+ export function getGFIUrl(
36
+ source: TileWMS | ImageWMS,
37
+ map: Map,
38
+ coordinate: Coordinate,
39
+ ): string | null {
40
+ const view = map.getView();
41
+ const projection = view.getProjection();
42
+ const resolution = view.getResolution() as number;
43
+ const params = {
44
+ ...source.getParams(),
45
+ INFO_FORMAT: "application/json",
46
+ };
47
+ return (
48
+ source.getFeatureInfoUrl(coordinate, resolution, projection, params) ?? null
49
+ );
50
+ }
51
+
52
+ export function getFeaturesFromWmsSources(
53
+ olMap: Map,
54
+ coordinate: Coordinate,
55
+ ): Promise<Feature[]> {
56
+ const wmsSources: (ImageWMS | TileWMS)[] = olMap
57
+ .getLayers()
58
+ .getArray()
59
+ .filter(
60
+ (layer): layer is Layer<ImageWMS | TileWMS> =>
61
+ layer instanceof Layer &&
62
+ (layer.getSource() instanceof TileWMS ||
63
+ layer.getSource() instanceof ImageWMS),
64
+ )
65
+ .map((layer) => layer.getSource()!);
66
+
67
+ if (!wmsSources.length) {
68
+ return Promise.resolve([]);
69
+ }
70
+
71
+ const gfiUrls = wmsSources.reduce((urls, source) => {
72
+ const gfiUrl = getGFIUrl(source, olMap, coordinate);
73
+ return gfiUrl ? [...urls, gfiUrl] : urls;
74
+ }, [] as string[]);
75
+ return Promise.all(
76
+ gfiUrls.map((url) =>
77
+ fetch(url)
78
+ .then((response) => response.json())
79
+ .then((collection: FeatureCollection) => collection.features),
80
+ ),
81
+ ).then((features) => features.flat());
82
+ }
83
+
84
+ const getFeaturesFromWmsSourcesThrottled = throttle(
85
+ getFeaturesFromWmsSources,
86
+ 250,
87
+ );
88
+
89
+ async function readFeaturesAtPixel(
90
+ map: Map,
91
+ event: MapBrowserEvent<PointerEvent>,
92
+ ) {
93
+ return [
94
+ ...getFeaturesFromVectorSources(map, event.pixel),
95
+ ...(await getFeaturesFromWmsSourcesThrottled(map, event.coordinate)),
96
+ ];
97
+ }
98
+
99
+ function registerFeatureClickEvent(map: Map) {
100
+ if (map.get(FeaturesClickEventType)) return;
101
+ map.on("click", async (event) => {
102
+ const features = await readFeaturesAtPixel(map, event);
103
+ map.dispatchEvent({
104
+ type: FeaturesClickEventType,
105
+ features,
106
+ } as unknown as BaseEvent);
107
+ });
108
+ map.set(FeaturesClickEventType, true);
109
+ }
110
+
111
+ function registerFeatureHoverEvent(map: Map) {
112
+ if (map.get(FeaturesHoverEventType)) return;
113
+ map.on("pointermove", async (event) => {
114
+ const features = await readFeaturesAtPixel(map, event);
115
+ map.dispatchEvent({
116
+ type: FeaturesHoverEventType,
117
+ features,
118
+ } as unknown as BaseEvent);
119
+ });
120
+ map.set(FeaturesHoverEventType, true);
121
+ }
122
+
123
+ export function listen<T extends keyof MapEventsByType>(
124
+ map: Map,
125
+ eventType: T,
126
+ callback: (event: MapEventsByType[T]) => void,
127
+ ) {
128
+ switch (eventType) {
129
+ case FeaturesClickEventType:
130
+ registerFeatureClickEvent(map);
131
+ // we're using a custom event type here so we need to cast to unknown first
132
+ map.on(eventType as unknown as MapObjectEventTypes, (event) => {
133
+ (callback as (event: unknown) => void)(event);
134
+ });
135
+ break;
136
+ case FeaturesHoverEventType:
137
+ registerFeatureHoverEvent(map);
138
+ // see comment above
139
+ map.on(eventType as unknown as MapObjectEventTypes, (event) => {
140
+ (callback as (event: unknown) => void)(event);
141
+ });
142
+ break;
143
+ case MapClickEventType:
144
+ map.on("click", (event) => {
145
+ const coordinate = toLonLat(
146
+ event.pixel,
147
+ map.getView().getProjection(),
148
+ ) as [number, number];
149
+ (callback as (event: unknown) => void)({
150
+ type: "map-click",
151
+ coordinate,
152
+ });
153
+ });
154
+ break;
155
+ default:
156
+ throw new Error(`Unrecognized event type: ${eventType}`);
157
+ }
158
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@geospatial-sdk/openlayers",
3
- "version": "0.0.5-dev.16+4001375",
3
+ "version": "0.0.5-dev.18+6f12b0b",
4
4
  "description": "OpenLayers-related utilities",
5
5
  "keywords": [
6
6
  "ol",
@@ -29,6 +29,7 @@
29
29
  },
30
30
  "devDependencies": {
31
31
  "@types/chroma-js": "^2.4.3",
32
+ "@types/lodash.throttle": "^4.1.9",
32
33
  "ol": "^8.2.0",
33
34
  "ol-mapbox-style": "^12.3.5"
34
35
  },
@@ -36,8 +37,9 @@
36
37
  "ol": ">6.x"
37
38
  },
38
39
  "dependencies": {
39
- "@geospatial-sdk/core": "^0.0.5-dev.16+4001375",
40
- "chroma-js": "^2.4.2"
40
+ "@geospatial-sdk/core": "^0.0.5-dev.18+6f12b0b",
41
+ "chroma-js": "^2.4.2",
42
+ "lodash.throttle": "^4.1.1"
41
43
  },
42
- "gitHead": "400137529b7bf0df095702ce7b899e0d51634c91"
44
+ "gitHead": "6f12b0b59e2794a24b27940c9c62dd279e2120e8"
43
45
  }