solid-map-gl 2.1.0 → 2.2.1
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 +5 -5
- package/dist/chunk/BTR7SKE6.js +7 -0
- package/dist/chunk/N4NHJCAS.jsx +28 -0
- package/dist/{index.d.ts → index/index.d.ts} +185 -5
- package/dist/index/index.js +10 -0
- package/dist/{index.jsx → index/index.jsx} +563 -142
- package/dist/testing/index.d.ts +109 -0
- package/dist/testing/index.js +8 -0
- package/dist/testing/index.jsx +334 -0
- package/package.json +38 -22
- package/dist/index.js +0 -11
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
[](https://github.com/GIShub4/solid-map-gl/actions/workflows/ci.yml)
|
|
6
6
|
[](https://codecov.io/gh/GIShub4/solid-map-gl)
|
|
7
7
|
[](https://www.npmjs.com/package/solid-map-gl)
|
|
8
|
-
[](https://www.npmjs.com/package/solid-map-gl)
|
|
9
9
|
[](LICENSE/)
|
|
10
10
|
|
|
11
11
|
[SolidJS](https://www.solidjs.com/) Component Library for [Mapbox GL JS](https://github.com/mapbox/mapbox-gl-js) and [MapLibre GL.](https://maplibre.org/projects/maplibre-gl-js/) Both libraries render interactive maps from vector tiles and Map styles using WebGL. This project is intended to be as close as possible to the [Mapbox GL JS API.](https://docs.mapbox.com/mapbox-gl-js/api/)
|
|
@@ -85,10 +85,10 @@ import MapGL, { Viewport, Source, Layer } from "solid-map-gl";
|
|
|
85
85
|
import 'mapbox-gl/dist/mapbox-gl.css'
|
|
86
86
|
|
|
87
87
|
const App: Component = () => {
|
|
88
|
-
const [viewport, setViewport] = createSignal({
|
|
88
|
+
const [viewport, setViewport] = createSignal<Viewport>({
|
|
89
89
|
center: [-122.45, 37.78],
|
|
90
90
|
zoom: 11,
|
|
91
|
-
}
|
|
91
|
+
});
|
|
92
92
|
|
|
93
93
|
return (
|
|
94
94
|
<MapGL
|
|
@@ -143,10 +143,10 @@ import * as maplibre from 'maplibre-gl'
|
|
|
143
143
|
import 'maplibre-gl/dist/maplibre-gl.css'
|
|
144
144
|
|
|
145
145
|
const App: Component = () => {
|
|
146
|
-
const [viewport, setViewport] = createSignal({
|
|
146
|
+
const [viewport, setViewport] = createSignal<Viewport>({
|
|
147
147
|
center: [-122.45, 37.78],
|
|
148
148
|
zoom: 11,
|
|
149
|
-
}
|
|
149
|
+
});
|
|
150
150
|
|
|
151
151
|
return (
|
|
152
152
|
<MapGL
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { createComponent } from 'solid-js/web';
|
|
2
|
+
import { createContext, useContext, createEffect } from 'solid-js';
|
|
3
|
+
import { createStore } from 'solid-js/store';
|
|
4
|
+
|
|
5
|
+
var a={map:null,mapLib:null,isMapLibre:false,constants:{},themeVersion:0},o=createContext([a]),f=()=>useContext(o),h=e=>{let[r,t]=createStore({...a});return e.map&&t("map",e.map),e.mapLib&&t("mapLib",e.mapLib),t("isMapLibre",!!e.isMapLibre),t("constants",e.constants||{}),t("themeVersion",e.themeVersion||0),createEffect(()=>t("constants",e.constants||{})),createEffect(()=>t("themeVersion",e.themeVersion||0)),createComponent(o.Provider,{value:[r],get children(){return e.children}})};
|
|
6
|
+
|
|
7
|
+
export { f as a, h as b };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
// src/components/MapProvider/index.tsx
|
|
2
|
+
import { createContext, useContext, createEffect } from "solid-js";
|
|
3
|
+
import { createStore } from "solid-js/store";
|
|
4
|
+
var defaultState = {
|
|
5
|
+
map: null,
|
|
6
|
+
mapLib: null,
|
|
7
|
+
isMapLibre: false,
|
|
8
|
+
constants: {},
|
|
9
|
+
themeVersion: 0
|
|
10
|
+
};
|
|
11
|
+
var MapContext = createContext([defaultState]);
|
|
12
|
+
var useMapContext = () => useContext(MapContext);
|
|
13
|
+
var MapProvider = (props) => {
|
|
14
|
+
const [state, setState] = createStore({ ...defaultState });
|
|
15
|
+
props.map && setState("map", props.map);
|
|
16
|
+
props.mapLib && setState("mapLib", props.mapLib);
|
|
17
|
+
setState("isMapLibre", !!props.isMapLibre);
|
|
18
|
+
setState("constants", props.constants || {});
|
|
19
|
+
setState("themeVersion", props.themeVersion || 0);
|
|
20
|
+
createEffect(() => setState("constants", props.constants || {}));
|
|
21
|
+
createEffect(() => setState("themeVersion", props.themeVersion || 0));
|
|
22
|
+
return <MapContext.Provider value={[state]}>{props.children}</MapContext.Provider>;
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export {
|
|
26
|
+
useMapContext,
|
|
27
|
+
MapProvider
|
|
28
|
+
};
|
|
@@ -1,6 +1,76 @@
|
|
|
1
1
|
import { Component, JSX, ParentComponent, VoidComponent } from 'solid-js';
|
|
2
2
|
import { MapMouseEvent, MapTouchEvent, MapWheelEvent, MapDataEvent, MapBoxZoomEvent, LngLatLike, LngLatBounds, PaddingOptions, MapboxOptions, StyleSpecification, SourceSpecification, CustomLayerInterface, FilterSpecification, FogSpecification, NavigationControlOptions, ScaleControlOptions, AttributionControlOptions, FullscreenControlOptions, GeolocateControlOptions, MarkerOptions, PopupOptions, StyleImageInterface, Map as Map$1, LightSpecification } from 'mapbox-gl';
|
|
3
3
|
|
|
4
|
+
/** Any object shaped enough like `mapboxgl.Map`/`maplibregl.Map` for the functions in this module —
|
|
5
|
+
* kept loose (not the real `mapboxgl.Map` type) so this file has no hard dependency on either
|
|
6
|
+
* library's types. */
|
|
7
|
+
type SettleableMap = {
|
|
8
|
+
areTilesLoaded(): boolean;
|
|
9
|
+
triggerRepaint(): void;
|
|
10
|
+
once(event: "idle", cb: () => void): unknown;
|
|
11
|
+
style?: {
|
|
12
|
+
hasTransitions?: () => boolean;
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
type SettleOptions = {
|
|
16
|
+
/** Max time (ms) to keep polling `areTilesLoaded()` before giving up and moving on anyway.
|
|
17
|
+
* Default 10000. */
|
|
18
|
+
timeout?: number;
|
|
19
|
+
/** Extra flat delay (ms) to outlast a `raster-fade-duration` cross-fade still in flight after
|
|
20
|
+
* tiles report loaded — there's no public event for "the fade finished", and the internal
|
|
21
|
+
* tracking (`hasActiveFadeTransition`) doesn't reliably cover imported style fragments (e.g.
|
|
22
|
+
* Standard/Standard Satellite). Default 400 (mapbox-gl's own `raster-fade-duration` default is
|
|
23
|
+
* 300). Set to 0 to skip this step entirely. */
|
|
24
|
+
fadeMargin?: number;
|
|
25
|
+
};
|
|
26
|
+
/** The actual "is this map done, visually" check: polls `areTilesLoaded()`, confirms a real paint
|
|
27
|
+
* via two animation frames, then (unless `fadeMargin` is 0) waits out any raster-fade cross-fade
|
|
28
|
+
* still in flight. Call this from inside your own `map.once('idle', ...)` — it doesn't listen for
|
|
29
|
+
* 'idle' itself, since 'idle' can otherwise fire while raster tiles are still fetching, mid
|
|
30
|
+
* GPU-upload, or still cross-fading in, none of which 'idle' itself waits out. Use
|
|
31
|
+
* `waitForIdleAndSettle` for the common case of "wait for the next idle, then this". */
|
|
32
|
+
declare function settleAfterIdle(map: SettleableMap, options?: SettleOptions): Promise<void>;
|
|
33
|
+
/** Waits for the map's next 'idle' event, then `settleAfterIdle`. The convenience entry point for
|
|
34
|
+
* off-screen/headless capture: call your own `jumpTo`/`fitBounds`/`setData` first, then `await` this
|
|
35
|
+
* before reading the canvas. */
|
|
36
|
+
declare function waitForIdleAndSettle(map: SettleableMap, options?: SettleOptions): Promise<void>;
|
|
37
|
+
/** Zeros `raster-fade-duration` on every layer that supports it, so newly-loaded raster tiles
|
|
38
|
+
* appear at full opacity immediately instead of cross-fading in over mapbox-gl's default 300ms —
|
|
39
|
+
* that fade is a paint-time opacity animation, invisible to `areTilesLoaded()`/`isSourceLoaded()`,
|
|
40
|
+
* so a capture taken right on load/idle can otherwise catch tiles still visibly fading in. Tries
|
|
41
|
+
* every layer rather than filtering to `type === "raster"`: some styles (e.g. Mapbox's
|
|
42
|
+
* Standard/Standard Satellite family) compose their base imagery in ways that don't always surface
|
|
43
|
+
* as a plain `"raster"`-typed layer in `getStyle().layers`, so filtering by type risked silently
|
|
44
|
+
* missing the actual imagery layer — `setPaintProperty` throwing for a layer type that doesn't
|
|
45
|
+
* support this property is caught and ignored instead. */
|
|
46
|
+
declare function disableRasterFade(map: {
|
|
47
|
+
getStyle(): {
|
|
48
|
+
layers?: {
|
|
49
|
+
id: string;
|
|
50
|
+
}[];
|
|
51
|
+
} | undefined;
|
|
52
|
+
setPaintProperty(id: string, name: string, value: unknown): void;
|
|
53
|
+
}): void;
|
|
54
|
+
|
|
55
|
+
/** Handed to `<MapGL offscreen>`'s `onCapturerReady` callback. */
|
|
56
|
+
type MapCapturer = {
|
|
57
|
+
/** The raw mapboxgl.Map/maplibregl.Map instance — for anything not already covered by
|
|
58
|
+
* `<Source>`/`<Layer>` children, e.g. reading back computed values. Camera/data changes are
|
|
59
|
+
* still made the normal declarative way, via `<MapGL>`'s own `viewport` prop and `<Source>`'s
|
|
60
|
+
* `data` prop. */
|
|
61
|
+
map: any;
|
|
62
|
+
/** Waits for the map's next 'idle', then for every tile to be genuinely loaded, painted, and (if
|
|
63
|
+
* applicable) done cross-fading in — see `waitForIdleAndSettle`. Call this after changing
|
|
64
|
+
* `viewport`/`data` props. */
|
|
65
|
+
waitUntilSettled(): Promise<void>;
|
|
66
|
+
/** `map.getCanvas().toDataURL(type, quality)`. Call after `waitUntilSettled()`, or use
|
|
67
|
+
* `captureWhenSettled()` to do both in one call. The result can be handed to any PDF/document
|
|
68
|
+
* library — this doesn't depend on or assume one. */
|
|
69
|
+
capture(type?: string, quality?: number): string;
|
|
70
|
+
/** `await waitUntilSettled()` then `capture()`, in one call. */
|
|
71
|
+
captureWhenSettled(type?: string, quality?: number): Promise<string>;
|
|
72
|
+
};
|
|
73
|
+
|
|
4
74
|
type mapEventTypes = {
|
|
5
75
|
onMouseDown?: (event: MapMouseEvent) => void;
|
|
6
76
|
onMouseUp?: (event: MapMouseEvent) => void;
|
|
@@ -196,6 +266,46 @@ type Props$b = {
|
|
|
196
266
|
onViewportChange?: (viewport: Viewport) => void;
|
|
197
267
|
/** Event listener for User Interaction */
|
|
198
268
|
onUserInteraction?: (user: boolean) => void;
|
|
269
|
+
/** Called once every currently-required tile has actually finished loading *and* rendering after
|
|
270
|
+
* an 'idle' event — unlike 'onIdle' itself, which can fire while raster tiles are still
|
|
271
|
+
* fetching, mid GPU-upload, or still cross-fading in via `raster-fade-duration`. Re-fires after
|
|
272
|
+
* every idle, not just the initial load. */
|
|
273
|
+
onTilesLoaded?: () => void;
|
|
274
|
+
/** Max time (ms) to keep polling `areTilesLoaded()` after idle before giving up and moving on
|
|
275
|
+
* anyway, so a permanently-erroring tile can't block `onTilesLoaded` forever. Default 10000. */
|
|
276
|
+
tilesLoadedTimeout?: number;
|
|
277
|
+
/** Extra flat delay (ms) `onTilesLoaded` waits after tiles report loaded, to outlast any
|
|
278
|
+
* `raster-fade-duration` cross-fade still in flight — mapbox-gl-js exposes no public event for
|
|
279
|
+
* "the fade finished", and its own internal transition tracking doesn't reliably cover imported
|
|
280
|
+
* style fragments (e.g. Mapbox's Standard/Standard Satellite styles), so a flat margin is the
|
|
281
|
+
* only fully reliable option. Default 400 (mapbox-gl's own `raster-fade-duration` default is
|
|
282
|
+
* 300). Set to 0 to disable and get the old, faster-but-less-certain behavior. */
|
|
283
|
+
tilesLoadedFadeMargin?: number;
|
|
284
|
+
/** Renders the map off-screen (`position: fixed`, far outside the viewport) instead of filling
|
|
285
|
+
* its normal container, for capturing map images (e.g. PDF export) without showing the map to
|
|
286
|
+
* the user — an off-screen element has no layout to size itself against, so a width/height is
|
|
287
|
+
* required. `<Source>`/`<Layer>` children work exactly as they do on a normal `<MapGL>`, since
|
|
288
|
+
* they only ever read the map off context, never the DOM it's rendered into. */
|
|
289
|
+
offscreen?: {
|
|
290
|
+
width: number;
|
|
291
|
+
height: number;
|
|
292
|
+
/** Zero every layer's `raster-fade-duration` once the map loads — see `disableRasterFade`.
|
|
293
|
+
* Default `true`. */
|
|
294
|
+
disableRasterFade?: boolean;
|
|
295
|
+
};
|
|
296
|
+
/** Called once, after the map loads, with a capturer for grabbing the canvas as an image — only
|
|
297
|
+
* meaningful together with `offscreen`. Change `viewport`/`<Source>`'s `data` the normal
|
|
298
|
+
* declarative way, then call `capturer.captureWhenSettled()`, which waits for the map to fully
|
|
299
|
+
* settle (see `onTilesLoaded`, reusing this same `tilesLoadedTimeout`/`tilesLoadedFadeMargin`)
|
|
300
|
+
* before reading the canvas. The result (a data URL) can be handed to any PDF/document library —
|
|
301
|
+
* this doesn't depend on or assume one. */
|
|
302
|
+
onCapturerReady?: (capturer: MapCapturer) => void;
|
|
303
|
+
/** Called if map initialization fails — e.g. `mapLib.supported()` reports the environment can't
|
|
304
|
+
* run Mapbox/MapLibre GL JS (any WebGL-less context, including Vitest/jsdom), or the underlying
|
|
305
|
+
* `new mapLib.Map(...)` constructor itself throws. Always logged via `console.error` in addition
|
|
306
|
+
* to this callback, so nothing is silently lost if it isn't provided — pass it to show fallback
|
|
307
|
+
* UI instead of (or alongside) the console log. */
|
|
308
|
+
onError?: (error: Error) => void;
|
|
199
309
|
/** Displays Map Tile Borders */
|
|
200
310
|
showTileBoundaries?: boolean;
|
|
201
311
|
/** Displays Wireframe if Terrain is visible */
|
|
@@ -245,7 +355,7 @@ type MapContextState = {
|
|
|
245
355
|
* light/dark judgment, just "something in the environment that could affect a resolved CSS
|
|
246
356
|
* value just changed." Layer reads this only to know *when* to re-probe a "bg-x dark:bg-y"
|
|
247
357
|
* color pair, never to decide which of the two applies (the browser's own cascade decides that,
|
|
248
|
-
* see resolveColor in
|
|
358
|
+
* see resolveColor in components/Layer/colors.ts) — so it stays correct even for a dark-mode strategy (e.g. a
|
|
249
359
|
* `data-theme` attribute) MapGL's own class-based heuristic wouldn't recognize as "dark" */
|
|
250
360
|
themeVersion: number;
|
|
251
361
|
};
|
|
@@ -270,6 +380,29 @@ type Props$a = {
|
|
|
270
380
|
declare const Source: Component<Props$a>;
|
|
271
381
|
|
|
272
382
|
type FlatLayerStyle = Record<string, any>;
|
|
383
|
+
type PulseConfig = {
|
|
384
|
+
/** The paint property to animate, e.g. `"icon-halo-width"`, `"icon-opacity"`, or a
|
|
385
|
+
* `*-color` property (e.g. `"icon-halo-color"`) to fade/shift a color instead of a number.
|
|
386
|
+
* Default `"icon-halo-width"` — override for anything other than a symbol layer's halo
|
|
387
|
+
* (e.g. `"circle-radius"`/`"circle-opacity"` on a circle layer). */
|
|
388
|
+
property?: string;
|
|
389
|
+
/** Start value — a number for a plain paint property, or any CSS color string (hex, named,
|
|
390
|
+
* rgb/rgba, a Tailwind name, ...) when animating a `*-color` property. Default `0`. */
|
|
391
|
+
from?: number | string;
|
|
392
|
+
/** Default `4` — see `PULSE_DEFAULTS`'s comment for why this stays under mapbox's fixed
|
|
393
|
+
* `icon-halo-width <~ 6 * icon-size` ceiling before the halo fills the whole icon. */
|
|
394
|
+
to?: number | string;
|
|
395
|
+
/** Full cycle length, in ms. Default `1500`. */
|
|
396
|
+
duration?: number;
|
|
397
|
+
/** - `"out"` (default): a one-directional ease-out ramp from `from` to `to`, holding at `to`
|
|
398
|
+
* for the last quarter of the cycle before resetting — Tailwind's `animate-ping` shape
|
|
399
|
+
* (e.g. a ring that grows outward and fades, then disappears until the next cycle). The
|
|
400
|
+
* most common "pulsing dot" look.
|
|
401
|
+
* - `"in"`: the mirror of `"out"` — ramps from `to` down to `from`, holding at `from`.
|
|
402
|
+
* - `"in-out"`: smooth back-and-forth between `from` and `to`, forever (sine-eased) — e.g. a
|
|
403
|
+
* halo that grows and shrinks continuously, with no reset. */
|
|
404
|
+
waveform?: "in-out" | "out" | "in";
|
|
405
|
+
};
|
|
273
406
|
type Props$9 = {
|
|
274
407
|
id?: string;
|
|
275
408
|
/** A string that uniquely identifies the layer. If not provided, a unique ID will be generated. */
|
|
@@ -294,6 +427,15 @@ type Props$9 = {
|
|
|
294
427
|
state: Record<string, any>;
|
|
295
428
|
};
|
|
296
429
|
/** An object that specifies the state of a feature in the layer. The object consists of an ID (either a number or a string) and an object containing the state. */
|
|
430
|
+
/** Continuously animates one paint property via `setPaintProperty` every animation frame —
|
|
431
|
+
* e.g. a growing/fading `icon-halo-width`/`icon-halo-color` for a "pulsing dot" marker. Every
|
|
432
|
+
* field defaults (see `PulseConfig`), so `pulse` alone or `pulse={{}}` already pulses a
|
|
433
|
+
* symbol layer's halo — override only what you need to customize. Pass an array to drive
|
|
434
|
+
* several properties at once (one shared `requestAnimationFrame` loop), e.g. `icon-halo-width`
|
|
435
|
+
* and `icon-opacity` together for a combined ping. Driven by real paint properties (not a
|
|
436
|
+
* swapped-out image), so it composes with any other paint value, including data-driven
|
|
437
|
+
* expressions on other properties of the same layer. */
|
|
438
|
+
pulse?: boolean | PulseConfig | PulseConfig[];
|
|
297
439
|
children?: any;
|
|
298
440
|
} & layerEventTypes;
|
|
299
441
|
declare const Layer: Component<Props$9>;
|
|
@@ -393,8 +535,35 @@ type Props$5 = {
|
|
|
393
535
|
};
|
|
394
536
|
declare const Popup: Component<Props$5>;
|
|
395
537
|
|
|
396
|
-
type
|
|
538
|
+
type SDFOptions = {
|
|
539
|
+
/** Pixels of gradient falloff encoded around each edge. Needs matching empty margin
|
|
540
|
+
* around the source art (see `sdfPadding`) or the field clips at the bitmap border. */
|
|
541
|
+
radius?: number;
|
|
542
|
+
/** Where along the gradient (0-1) the shape's "true" edge sits; matches mapbox's own
|
|
543
|
+
* glyph default. */
|
|
544
|
+
cutoff?: number;
|
|
545
|
+
};
|
|
546
|
+
type PixelData = {
|
|
547
|
+
width: number;
|
|
548
|
+
height: number;
|
|
549
|
+
data: Uint8Array | Uint8ClampedArray;
|
|
550
|
+
};
|
|
551
|
+
declare function toSDF(imageData: PixelData, { radius, cutoff }?: SDFOptions): PixelData;
|
|
552
|
+
|
|
553
|
+
type Pattern = {
|
|
554
|
+
size: number;
|
|
555
|
+
path: string;
|
|
556
|
+
fill?: boolean;
|
|
557
|
+
};
|
|
558
|
+
declare const PATTERN: Record<string, Pattern>;
|
|
397
559
|
declare const patternList: string[];
|
|
560
|
+
type PatternName = keyof typeof PATTERN;
|
|
561
|
+
declare const SYMBOL: Record<string, string>;
|
|
562
|
+
declare const symbolList: string[];
|
|
563
|
+
type SymbolName = keyof typeof SYMBOL;
|
|
564
|
+
|
|
565
|
+
type StyleImageMetadata = NonNullable<Parameters<Map$1['addImage']>[2]>;
|
|
566
|
+
|
|
398
567
|
type Color = `#${string}` | `rgb(${number}, ${number}, ${number})` | `rgba(${number}, ${number}, ${number}, ${number})` | `hsl(${number}, ${number}%, ${number}%)` | `hsla(${number}, ${number}%, ${number}%, ${number})`;
|
|
399
568
|
type Props$4 = {
|
|
400
569
|
id: string;
|
|
@@ -412,11 +581,22 @@ type Props$4 = {
|
|
|
412
581
|
};
|
|
413
582
|
/** The options for the image */
|
|
414
583
|
pattern?: {
|
|
415
|
-
type: string;
|
|
584
|
+
type: PatternName | (string & {});
|
|
416
585
|
color: Color;
|
|
417
586
|
background: Color;
|
|
418
|
-
|
|
587
|
+
lineWidth: number;
|
|
419
588
|
};
|
|
589
|
+
/** The pattern to be used for the image component. */
|
|
590
|
+
/** A predefined icon shape (see `symbolList`, e.g. `"triangle"`, `"hexagon"`), full custom
|
|
591
|
+
* SVG markup, or a raw SVG path `d` string. Resolved the same way `source` is — including
|
|
592
|
+
* `sdf` and `options.fill`/`options.stroke` — so it's just a convenient way to pick a
|
|
593
|
+
* built-in shape instead of writing the markup yourself. Ignored if `source` is set. */
|
|
594
|
+
symbol?: SymbolName | (string & {});
|
|
595
|
+
/** Convert the rasterized source into a real signed-distance-field bitmap (not just
|
|
596
|
+
* tagged with `sdf: true`), so `icon-color`/`icon-halo-color`/`icon-halo-width`/
|
|
597
|
+
* `icon-halo-blur` can recolor and outline it crisply from layer paint properties.
|
|
598
|
+
* Only applies to `source`/`symbol`, not `pattern`. */
|
|
599
|
+
sdf?: boolean | SDFOptions;
|
|
420
600
|
};
|
|
421
601
|
declare const MGL_Image: VoidComponent<Props$4>;
|
|
422
602
|
|
|
@@ -503,4 +683,4 @@ type Props = {
|
|
|
503
683
|
/** Adds a deck.gl overlay control to the map, forwarding `props` reactively via `setProps`. */
|
|
504
684
|
declare const DeckOverlay: VoidComponent<Props>;
|
|
505
685
|
|
|
506
|
-
export { Atmosphere, Camera, type Color, Control, DeckOverlay, Draw, MGL_Image as Image, Layer, Layer3D, Light, type MapLibreSky, MapProvider, Marker, Popup, Source, Terrain, type Viewport, MapGL as default, patternList, useMapContext, useScene, useSourceId };
|
|
686
|
+
export { Atmosphere, Camera, type Color, Control, DeckOverlay, Draw, MGL_Image as Image, Layer, Layer3D, Light, type MapCapturer, type MapLibreSky, MapProvider, Marker, type PatternName, type PixelData, Popup, type SDFOptions, type SettleOptions, type SettleableMap, Source, type SymbolName, Terrain, type Viewport, MapGL as default, disableRasterFade, patternList, settleAfterIdle, symbolList, toSDF, useMapContext, useScene, useSourceId, waitForIdleAndSettle };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { b, a } from '../chunk/BTR7SKE6.js';
|
|
2
|
+
export { b as MapProvider, a as useMapContext } from '../chunk/BTR7SKE6.js';
|
|
3
|
+
import { template, isServer, use, insert, memo, createComponent, effect, setAttribute, className, classList, style } from 'solid-js/web';
|
|
4
|
+
import { createContext, createSignal, onMount, createEffect, on, onCleanup, useContext, createUniqueId, createMemo, splitProps, untrack } from 'solid-js';
|
|
5
|
+
|
|
6
|
+
var ye=["onMouseDown","onMouseUp","onMouseOver","onMouseOut","onMouseMove","onMouseEnter","onMouseLeave","onPreClick","onClick","onDblClick","onContextMenu","onTouchStart","onTouchEnd","onTouchCancel","onWheel","onResize","onRemove","onTouchMove","onMoveStart","onMove","onMoveEnd","onDragStart","onDrag","onDragEnd","onZoomStart","onZoom","onZoomEnd","onRotateStart","onRotate","onRotatEnd","onPitchStart","onPitch","onPitchEnd","onBoxZoomStart","onBoxZoomEnd","onBoxZoomCancel","onWebglContextLost","onWebglContextRestored","onLoad","onRender","onIdle","onError","onData","onStyleData","onSourceData","onDataLoading","onStyleDataLoading","onSourceDataLoading","onStyleImageMissing"],ve=["onMouseDown","onMouseUp","onMouseOver","onMouseOut","onMouseMove","onMouseEnter","onMouseLeave","onClick","onDblClick","onContextMenu","onTouchStart","onTouchEnd","onTouchCancel"],Me=["onCreate","onDelete","onCombine","onUncombine","onUpdate","onSelectionchange","onModechange","onRender","onActionable"];var S="mapbox://styles/mapbox",A="https://raw.githubusercontent.com/",L="https://raw.githubusercontent.com/GIShub4/map-styles/main/",J="https://assets.vector.hereapi.com/styles/",be={mb:{standard:`${S}/standard`,light:`${S}/light-v11`,dark:`${S}/dark-v11`,street:`${S}/streets-v12`,outdoor:`${S}/outdoors-v12`,sat:`${S}/satellite-v9`,sat_street:`${S}/satellite-streets-v12`,nav_base:`${S}/navigation-guidance-day-v4`,nav_base_night:`${S}/navigation-guidance-night-v4`,nav:`${S}/navigation-day-v1`,nav_night:`${S}/navigation-night-v1`,basic:`${S}/cjf4m44iw0uza2spb3q0a7s41`,monochrome:`${S}/cjv6rzz4j3m4b1fqcchuxclhb`,leshine:`${S}/cjcunv5ae262f2sm9tfwg8i0w`,icecream:`${S}/cj7t3i5yj0unt2rmt3y4b5e32`,cali:`${S}/cjerxnqt3cgvp2rmyuxbeqme7`,northstar:`${S}/cj44mfrt20f082snokim4ungi`,mineral:`${S}/cjtep62gq54l21frr1whf27ak`,moonlight:`${S}/cj3kbeqzo00022smj7akz3o1e`,frank:`${S}-map-design/ckshxkppe0gge18nz20i0nrwq`,minimo:`${S}-map-design/cksjc2nsq1bg117pnekb655h1`,decimal:`${S}-map-design/ck4014y110wt61ctt07egsel6`,stand:`${S}-map-design/ckr0svm3922ki18qntevm857n`,blueprint:`${S}-map-design/cks97e1e37nsd17nzg7p0308g`,bubble:`${S}-map-design/cksysy2nl62zp17quosctdtcc`,pencil:`${S}-map-design/cks9iema71es417mlrft4go2k`,swiss_ski:`${A}mapbox/mapbox-gl-swiss-ski-style/master/cij1zoclj002y8rkkdjl69psd.json`,vintage:`${A}mapbox/mapbox-gl-vintage-style/master/cif5p01n202nisaktvljx9mv3.json`,whaam:`${A}mapbox/mapbox-gl-whaam-style/master/cii8323c8004w0nlvtss3dbm2.json`,neon:`${A}NatEvatt/awesome-mapbox-gl-styles/master/styles/Neon/style.json`,camoflauge:`${A}jingsam/mapbox-gl-styles/master/Camouflage.json`,emerald:`${A}jingsam/mapbox-gl-styles/master/Emerald.json`,runner:`${A}jingsam/mapbox-gl-styles/master/Runner.json`,x_ray:`${A}jingsam/mapbox-gl-styles/master/X-ray.json`},here:{base:`${J}berlin/base/mapbox/tilezen?apikey={apikey}`,day:`${J}berlin/day/mapbox/tilezen?apikey={apikey}`,night:`${J}berlin/night/mapbox/tilezen?apikey={apikey}`},esri:{blueprint:`${L}esri:blueprint.json`,charted_territory:`${L}esri:charted-territory.json`,colored_pencil:`${L}esri:colored-pencil.json`,community:`${L}esri:community.json`,mid_century:`${L}esri:mid-century.json`,modern_antique:`${L}esri:modern-antique.json`,nat_geo:`${L}esri:national-geographic.json`,newspaper:`${L}esri:newspaper.json`,open_street_map:`${L}esri:open-street-map.json`,light_gray_canvas:`${L}esri:light-gray-canvas.json`,dark_gray_canvas:`${L}esri:dark-gray-canvas.json`,human_geo_light:`${L}esri:human-geography-light.json`,human_geo_dark:`${L}esri:human-geography-dark.json`,world_navigation:`${L}esri:world-navigation.json`,world_street:`${L}esri:world-street.json`,world_street_night:`${L}esri:world-street-night.json`,world_terrain:`${L}esri:world-terrain.json`,world_terrain_hybrid:`${L}esri:world-terrain-hybrid.json`,world_topographic:`${L}esri:world-topographic.json`,chromium:`${L}esri:chromium.json`,dreamcatcher:`${L}esri:dreamcatcher.json`,seahaven:`${L}esri:seahaven.json`,sangria:`${L}esri:sangria.json`,mercurial:`${L}esri:mercurial.json`,imagery:`${L}esri:imagery.json`,imagery_hybrid:`${L}esri:imagery-hybrid.json`,firefly:`${L}esri:firefly.json`,firefly_hybrid:`${L}esri:firefly-hybrid.json`,oceans:`${L}esri:oceans.json`}},ee="https://{s}.basemaps.cartocdn.com/rastertiles/",N="https://stamen-tiles-{s}.a.ssl.fastly.net/",T="https://{s}.tile.thunderforest.com/",te={osm:{org:"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",human:"https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png",cycle:"https://{s}.tile-cyclosm.openstreetmap.fr/cyclosm/{z}/{x}/{y}.png",topo:"https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png",_copy:'<a href="https://www.openstreetmap.org/copyright" target="_blank">© OpenStreetMap</a>'},carto:{voyager:`${ee}voyager_labels_under/{z}/{x}/{y}{r}.png`,positron:`${ee}light_all/{z}/{x}/{y}{r}.png`,dark:`${ee}dark_all/{z}/{x}/{y}{r}.png`,_copy:'<a href="https://carto.com/attribution" target="_blank">© Carto</a>'},stamen:{toner:`${N}toner/{z}/{x}/{y}{r}.png`,toner_lite:`${N}toner-lite/{z}/{x}/{y}{r}.png`,watercolor:`${N}watercolor/{z}/{x}/{y}.png`,terrain:`${N}terrain/{z}/{x}/{y}{r}.png`,_copy:'<a href="https://stamen.com/privacy-policy" target="_blank">© Stamen Design</a>'},tf:{cycle:`${T}cycle/{z}/{x}/{y}{r}.png?apikey={apikey}`,trans:`${T}transport/{z}/{x}/{y}{r}.png?apikey={apikey}`,trans_dark:`${T}transport-dark/{z}/{x}/{y}{r}.png?apikey={apikey}`,landscape:`${T}landscape/{z}/{x}/{y}{r}.png?apikey={apikey}`,outdoors:`${T}outdoors/{z}/{x}/{y}{r}.png?apikey={apikey}`,neighbourhood:`${T}neighbourhood/{z}/{x}/{y}{r}.png?apikey={apikey}`,spinal:`${T}spinal-map/{z}/{x}/{y}{r}.png?apikey={apikey}`,pioneer:`${T}pioneer/{z}/{x}/{y}{r}.png?apikey={apikey}`,atlas:`${T}atlas/{z}/{x}/{y}{r}.png?apikey={apikey}`,mobile:`${T}mobile-atlas/{z}/{x}/{y}{r}.png?apikey={apikey}`,_copy:'<a href="https://thunderforest.com/privacy" target="_blank">© Thunderforest</a>'}};var z=()=>new Promise(e=>requestAnimationFrame(()=>e())),Qe=e=>{try{return !!e.style?.hasTransitions?.()}catch{return false}};function Ke(e,t){return new Promise(n=>{let o=Date.now()+t,r=()=>{if(e.areTilesLoaded()){n(true);return}if(Date.now()>=o){n(false);return}setTimeout(r,100);};r();})}async function q(e,t={}){let{timeout:n=1e4,fadeMargin:o=400}=t;if(await Ke(e,n),e.triggerRepaint(),await z(),await z(),o>0){let r=Date.now()+Math.max(o,2e3);for(;Qe(e)&&Date.now()<r;)e.triggerRepaint(),await z();await new Promise(i=>setTimeout(i,o)),e.triggerRepaint(),await z(),await z();}}function G(e,t={}){return new Promise(n=>{e.once("idle",()=>{q(e,t).then(n);});})}function ne(e){for(let t of e.getStyle()?.layers??[])try{e.setPaintProperty(t.id,"raster-fade-duration",0);}catch{}}function xe(e,t){return {map:e,waitUntilSettled:()=>G(e,t),capture:(n="image/jpeg",o=.92)=>e.getCanvas().toDataURL(n,o),captureWhenSettled:async(n="image/jpeg",o=.92)=>(await G(e,t),e.getCanvas().toDataURL(n,o))}}var st=template("<div>"),lt=template("<style>.overlay{position:relative;width:100%;height:100%;pointer-events:none}:where(.overlay>*){pointer-events:auto}"),ct=template("<div class=overlay>"),pt=e=>{let t,n,o,r,i,a=false,s=0,[c,l]=createSignal(null),[h,m]=createSignal(0),[b$1,d]=createSignal(!isServer&&(window.matchMedia("(prefers-color-scheme: dark)").matches||document.body.classList.contains("dark"))),f=false,v=false,y=(u,g)=>(e.debug||e.debugEvents)&&console.debug("%c[MapGL]","color: #0ea5e9",u,g||""),M=(u,g)=>{let p=b$1()&&g?g:u;return (typeof p=="string"||p instanceof String)&&p?.split(":").reduce((x,E)=>x&&x[E],be)?.replace("{apikey}",e.apikey||import.meta.env?.VITE_VECTOR_API_KEY)||p};onMount(async()=>{try{await C();}catch(u){console.error("[MapGL] Failed to initialize map:",u),e.onError?.(u);}});let C=async()=>{if(i=e.mapLib||await import('mapbox-gl'),i.Map||(i=window.maplibregl||window.mapboxgl),typeof i.supported=="function"&&!i.supported())throw new Error("Mapbox GL not supported");if(a=typeof i.Map?.prototype?.setConfigProperty!="function",y(`Map (v${i.version}) loading...`),t=new i.Map({accessToken:e.options?.accessToken||import.meta.env?.VITE_MAPBOX_ACCESS_TOKEN,interactive:e.options?.interactive||!!e.onViewportChange,...e.options,...e.viewport,projection:e.options?.projection,container:n,style:M(e.options?.style,e.darkStyle),fitBoundsOptions:{padding:e.viewport?.padding},...e.offscreen?{preserveDrawingBuffer:true}:{}}),t.debug=e.debug,t.debugEvents=e.debugEvents,t.sourceIdList=[],t.layerIdList=[],t.isMapLibre=a,ye.forEach(u=>{let g=e[u];if(g){let p=u.slice(2).toLowerCase();typeof g=="function"?t.on(p,x=>{setTimeout(()=>{p==="click"&&x.clickOnLayer||(g(x),e.debugEvents&&y(`Map '${p}' event:`,x));},0);}):Object.keys(g).forEach(x=>{t.on(p,x,E=>{setTimeout(()=>{p==="click"&&E.clickOnLayer||(g[x](E),e.debugEvents&&y(`Map '${p}' event on '${x}':`,E));},0);});});}}),e.onTilesLoaded){let u=e.tilesLoadedTimeout??1e4,g=e.tilesLoadedFadeMargin??400;t.on("idle",()=>{let p=++s;q(t,{timeout:u,fadeMargin:g}).then(()=>{p===s&&(y("Tiles settled"),e.onTilesLoaded());});});}t.once("load",()=>{l(t),y("Map loaded"),e.offscreen&&(e.offscreen.disableRasterFade!==false&&ne(t),e.onCapturerReady?.(xe(t,{timeout:e.tilesLoadedTimeout??1e4,fadeMargin:e.tilesLoadedFadeMargin??400}))),["mousedown","touchstart","wheel"].forEach(g=>t.on(g,p=>!p.rotate&&e.onUserInteraction?.(true))),["moveend","mouseup","touchend"].forEach(g=>t.on(g,p=>!p.rotate&&e.onUserInteraction?.(false)));let u=!isServer&&window.matchMedia("(prefers-color-scheme: dark)");u?.addEventListener("change",()=>{d(u.matches),m(g=>g+1),y("Set dark theme to:",u.matches?.toString());}),r=new MutationObserver(()=>{let g=document.documentElement.classList.contains("dark")||document.body.classList.contains("dark");d(g),m(p=>p+1),y("Set theme to:",g);}),r.observe(document.documentElement,{attributes:true}),r.observe(document.body,{attributes:true}),e.disableResize||(o=new ResizeObserver(()=>{setTimeout(()=>{t?.resize();},0),y("Map resized");}),o.observe(n)),t.on("move",g=>{let p={...e.viewport,id:e.id,point:{x:g.originalEvent?.x,y:g.originalEvent?.y},center:e.viewport?.center?.lat?t.getCenter():[t.getCenter().lng,t.getCenter().lat],zoom:t.getZoom(),pitch:t.getPitch(),bearing:t.getBearing(),inTransit:true,bounds:null};!g.viewport&&e.onViewportChange&&(v=true,e.onViewportChange(p));}),t.on("moveend",g=>{if(f||g.rotate||!e.onViewportChange)return;let p={...e.viewport,inTransit:false};v=true,e.onViewportChange(p);});});};createEffect(on(()=>e.viewport,u=>{if(!t||e.id!==u?.id)return;if(v){v=false;return}let g={...u,...u.bounds?t.cameraForBounds(u.bounds,{bearing:u?.bearing,pitch:u?.pitch,padding:u?.padding}):null};f=true,t.stop(),f=false,t[e.transitionType||"flyTo"](g),y(`Update Viewport (${e.transitionType||"flyTo"}):`,g);},{defer:true})),createEffect(()=>{let u=c();if(typeof u?.setConfigProperty!="function"){u&&e.config&&Object.keys(e.config).length&&y("Config prop is set but this map library has no setConfigProperty (Mapbox Standard Style only) \u2014 skipping");return}for(let g in e.config){if(!g||g==="id")continue;let p=e.config?.id||"basemap",x=e.config[g];u.setConfigProperty(p,g,x),y(`Set Config (${p}:${g}) to:`,x);}}),createEffect(()=>{let u=e.options?.projection;!t||!u||(t.setProjection(u),y("Set Projection to:",u));}),createEffect(()=>{let u=e.cursorStyle;!t||!u||(t.getCanvas().style.cursor=u,y("Set Cursor to:",u));});let P=(u,g)=>(g.forEach(p=>{let x=u.findIndex(E=>p.metadata.smg.beforeType?E.type===p.metadata.smg.beforeType:E.id===p.metadata.smg.beforeId);u=x===-1?[...u,p]:[...u.slice(0,x),p,...u.slice(x)];}),u);return createEffect(u=>{let g=M(e.options?.style,e.darkStyle);if(t?.isStyleLoaded()&&u!==g){let p=t.getStyle(),x=p.layers.filter(_=>t.layerIdList.includes(_.id)),E=Object.keys(p.sources).filter(_=>t.sourceIdList.includes(_)).reduce((_,he)=>({..._,[he]:p.sources[he]}),{}),Q=e.shouldDiffStyle?e.shouldDiffStyle(u,g):true;t.setStyle(g,Q?void 0:{diff:false}),t.once("styledata",()=>{if(!x)return;let _=t.getStyle();t.setStyle({..._,sources:{..._.sources,...E},layers:P(_.layers,x),fog:p.fog,terrain:p.terrain,light:p.light}),y("Set Mapstyle to:",g);});}return g},e.options?.style),["showTileBoundaries","showTerrainWireframe","showCollisionBoxes","showPadding","showOverdrawInspector"].forEach(u=>{createEffect(()=>{let g=e[u];!t||!g||(t[u]=g,y(`Set ${u} to:`,g));});}),onCleanup(()=>{o?.disconnect(),r?.disconnect(),s++,t?.remove(),y("Map removed");}),(()=>{var u=st(),g=n;return typeof g=="function"?use(g,u):n=u,insert(u,(()=>{var p=memo(()=>!!c());return ()=>p()&&createComponent(b,{get map(){return c()},mapLib:i,isMapLibre:a,get constants(){return e.constants},get themeVersion(){return h()},get children(){return [lt(),(()=>{var x=ct();return insert(x,()=>e.children),x})()]}})})()),effect(p=>{var x=e.id,E=e?.class,Q=e?.classList,_=e.offscreen?{position:"fixed",left:"-99999px",top:"-99999px",width:`${e.offscreen.width}px`,height:`${e.offscreen.height}px`,...e.style}:{width:"100%",height:"100%",...e.style};return x!==p.e&&setAttribute(u,"id",p.e=x),E!==p.t&&className(u,p.t=E),p.a=classList(u,Q,p.a),p.o=style(u,_,p.o),p},{e:void 0,t:void 0,a:void 0,o:void 0}),u})()};var Ce=createContext(),V=()=>useContext(Ce),Mt=e=>{let[t]=a();e.id??=createUniqueId();let n=(i,a)=>{t.map.debug&&console.debug("%c[MapGL]","color: #ec4899",i,a||"");},o=()=>e.source,r=i=>{let a=i?.split(":").reduce((c,l)=>c&&c[l],te),s=a?{...o(),url:"",tiles:[a.replace("{apikey}",o().apikey||import.meta.env?.VITE_RASTER_API_KEY).replace("{r}",window.devicePixelRatio>1?"@2x":"")],attribution:te[i.split(":")[0]]._copy}:o();return s.tiles&&(s.tiles=["a","b","c"].map(c=>s.tiles[0].replace("{s}",c))),s};switch(t.map.addSource(e.id,r(o().url)),t.map.sourceIdList.push(e.id),n("Add Source:",e.id),o().type){case "geojson":createEffect(()=>{let i=o().data;t.map.getSource(e.id).setData(i||{}),n("Update GeoJSON Data:",e.id);});break;case "image":createEffect(()=>{let i=o().url,a=o().coordinates;t.map.getSource(e.id).updateImage(i,a),n("Update Image Data:",e.id);});break;case "vector":createEffect(()=>{let i=o().url,a=o().tiles,s=t.map.getSource(e.id);i?s.setUrl(i):s.setTiles(a),n("Update Vector Data:",e.id);});break;case "raster":createEffect(()=>{let i=r(o().url),a=t.map.getSource(e.id);i.url?a.setUrl(i.url):a.setTiles(i.tiles),n("Update Raster Data:",e.id);});break}return onCleanup(()=>{t.map?.getStyle().layers.forEach(i=>i.source===e.id&&t.map.removeLayer(i.id)),t.map?.getSource(e.id)&&t.map?.removeSource(e.id),n("Remove Source:",e.id);}),createComponent(Ce.Provider,{get value(){return e.id},get children(){return e.children}})};var Se=["id","type","filter","source","source-layer","minzoom","metadata","maxzoom","paint","layout"],Pe=["visibility","line-join","line-cap","line-miter-limit","line-round-limit","line-sort-key","circle-sort-key","symbol-avoid-edges","symbol-placement","symbol-sort-key","symbol-spacing","symbol-z-order","icon-allow-overlap","icon-anchor","icon-ignore-placement","icon-image","icon-keep-upright","icon-offset","icon-optional","icon-padding","icon-pitch-alignment","icon-rotate","icon-rotation-alignment","icon-size","icon-text-fit","icon-text-fit-padding","text-allow-overlap","text-anchor","text-field","text-font","text-ignore-placement","text-justify","text-keep-upright","text-letter-spacing","text-line-height","text-max-angle","text-max-width","text-offset","text-optional","text-padding","text-pitch-alignment","text-radial-offset","text-rotate","text-rotation-alignment","text-size","text-transform","text-variable-anchor","text-writing-mode"];var O,ae=e=>(O??=document.body.appendChild(document.createElement("div")),O.style.cssText="position:absolute;visibility:hidden;pointer-events:none",O.style.color="",O.style.color=e,O.style.color?getComputedStyle(O).color:void 0),bt=/^[a-z]+-\d{2,3}$/,xt=/^(rgb|rgba|hsl|hsla)\(/i,wt=/^[a-z-]+\(/i,U,Lt=/^bg-[a-z]+-\d{2,3}(?:\s+dark:bg-[a-z]+-\d{2,3})?$/,Ct=e=>{U??=document.body.appendChild(document.createElement("div")),U.style.cssText="position:absolute;visibility:hidden;pointer-events:none",U.className=e;let t=getComputedStyle(U).backgroundColor;return U.className="",t&&t!=="rgba(0, 0, 0, 0)"?t:e},ie=e=>{if(Lt.test(e))return Ct(e);if(bt.test(e)){let t=getComputedStyle(document.documentElement).getPropertyValue(`--color-${e}`).trim();return t&&ae(t)||e}return wt.test(e)&&!xt.test(e)&&ae(e)||e},se=e=>{let n=(ae(ie(e))??e).match(/rgba?\(([^)]+)\)/i);if(!n)return [0,0,0,1];let[o,r,i,a=1]=n[1].split(",").map(Number);return [o,r,i,a]};var Et={property:"icon-halo-width",from:0,to:4,duration:1500,waveform:"out"},kt=.75,_t=e=>1-(1-e)*(1-e),It=(e,t,n)=>{let o=e%t/t;if(n==="in-out")return (1-Math.cos(o*Math.PI*2))/2;let r=Math.min(o/kt,1);return _t(r)},Tt=(e,t,n)=>{let o=Math.round(e[0]+(t[0]-e[0])*n),r=Math.round(e[1]+(t[1]-e[1])*n),i=Math.round(e[2]+(t[2]-e[2])*n),a=e[3]+(t[3]-e[3])*n;return `rgba(${o}, ${r}, ${i}, ${a})`},ke=(e={},t={})=>[...new Set([...Object.keys(e),...Object.keys(t)])].reduce((o,r)=>{let i=e[r];return i!==t[r]&&o.push([r,i]),o},[]),le=(e,t)=>(e.startsWith(t)||e.startsWith("icon")||e.startsWith("text")?"":t+"-")+e.replace(/[A-Z]/g,n=>"-"+n.toLowerCase()),$t=["slot","filter","visible","beforeId","beforeType"],_e=(e,t)=>e.endsWith("color")?Array.isArray(t)?t.map(n=>_e(e,n)):typeof t=="string"?ie(t):t:t,At=/^@(.+)$/,Y=(e,t,n,o)=>{if(Array.isArray(t))return t.map(a=>Y(e,a,n,o));if(typeof t!="string")return t;let r=t.match(At);if(!r)return t;let i=n[r[1]];return i===void 0?(o(`Unknown constant "@${r[1]}" referenced by "${e}" \u2014 leaving unresolved`),t):i},ce=(e,t={},n=()=>{})=>{if(!e)return;let o={},r={},i={},a=(s,c)=>_e(s,Y(s,c,t,n));return Object.entries(e).forEach(([s,c])=>{if(Se.includes(s))i[s]=c;else {$t.includes(s)&&n(`"${s}" is a <Layer> prop, not a style property \u2014 belongs outside "style", not inside it. Treating it as a paint/layout property instead.`);let l=le(s,e.type);Pe.includes(l)?o[l]=Y(l,c,t,n):r[l]=a(l,c);}}),e.paint&&Object.entries(e.paint).forEach(([s,c])=>{let l=le(s,e.type);r[l]=a(l,c);}),e.layout&&Object.entries(e.layout).forEach(([s,c])=>{let l=le(s,e.type);o[l]=Y(l,c,t,n);}),{...i,paint:r,layout:o}},Ft=e=>{let[t]=a(),n=e.sourceId||e.style?.source||V(),o=e.id||e.customLayer?.id||createUniqueId(),r=(a,s)=>{(t.map.debug||t.map.debugEvents)&&console.debug("%c[MapGL]","color: #10b981",a,s||"");},i=createMemo(()=>e.beforeType?t.map.getStyle().layers.find(a=>a.type===e.beforeType)?.id:e.beforeId);return t.map.addLayer(e.customLayer||{...ce(e.style,t.constants,r),id:o,source:n,...t.isMapLibre?{}:{slot:e.slot||""},metadata:{smg:{beforeType:e.beforeType,beforeId:e.beforeId}}},i()),t.map.layerIdList.push(o),e.customLayer&&t.map.fire("load"),r("Add Layer:",o),ve.forEach(a=>{if(e[a]){let s=a.slice(2).toLowerCase();t.map.on(s,o,c=>{s==="click"&&(c.clickOnLayer=true),e[a](c),t.map.debugEvents&&r(`Layer '${s}' event on '${o}':`,c);});}}),createEffect(a=>{t.themeVersion;let s=ce(e.style,t.constants,r);if(s!==a)return s.layout!==a?.layout&&ke(s.layout,a?.layout).forEach(([c,l])=>t.map.setLayoutProperty(o,c,l,{validate:false})),s.paint!==a?.paint&&ke(s.paint,a?.paint).forEach(([c,l])=>t.map.setPaintProperty(o,c,l,{validate:false})),(s.minzoom!==a?.minzoom||s.maxzoom!==a?.maxzoom)&&t.map.setLayerZoomRange(o,s.minzoom,s.maxzoom),s.filter!==a?.filter&&t.map.setFilter(o,s.filter,{validate:false}),r("Update Layer Style:",o),s},ce(e.style,t.constants,r)),createEffect(a=>{if(e.visible!==a)return t.map.setLayoutProperty(o,"visibility",e.visible?"visible":"none",{validate:false}),r(`Update Visibility (${o}):`,e.visible.toString()),e.visible},e.visible),createEffect(a=>i()===a?a:(t.map.moveLayer(o,i()),r(`Update Layer Z-Index (${o}):`,i()),i()),i()),createEffect(a=>e.filter===a||a===void 0&&!e.filter?a:(t.map.setFilter(o,e.filter??null),r(`Update Filter (${o}):`,e.filter),e.filter),void 0),createEffect(async()=>{!e.featureState||e.featureState.id===null||(!t.map.isStyleLoaded()&&await t.map.once("styledata"),t.map.removeFeatureState({source:n,sourceLayer:e.style["source-layer"]}),t.map.setFeatureState({source:n,sourceLayer:e.style["source-layer"],id:e.featureState.id},e.featureState.state));}),createEffect(()=>{if(!e.pulse)return;let s=(e.pulse===true?[{}]:Array.isArray(e.pulse)?e.pulse:[e.pulse]).map(m=>{let{property:b,from:d,to:f,duration:v,waveform:y}={...Et,...m},M=typeof d=="string"||typeof f=="string",[C,P]=y==="in"?[f,d]:[d,f];return {property:b,duration:v,waveform:y,isColor:M,fromNum:M?0:C,toNum:M?0:P,fromRgba:M?se(C):null,toRgba:M?se(P):null}});s.forEach(m=>{t.map.setPaintProperty(o,`${m.property}-transition`,{duration:0,delay:0},{validate:false});});let c=performance.now(),l,h=m=>{let b=m-c;s.forEach(d=>{let f=It(b,d.duration,d.waveform),v=d.isColor?Tt(d.fromRgba,d.toRgba,f):d.fromNum+(d.toNum-d.fromNum)*f;t.map.setPaintProperty(o,d.property,v,{validate:false});}),l=window.requestAnimationFrame(h);};l=window.requestAnimationFrame(h),r(`Start Pulse (${o}):`,e.pulse),onCleanup(()=>window.cancelAnimationFrame(l));}),onCleanup(()=>t.map?.getLayer(o)&&t.map?.removeLayer(o)),e.children};var Ie=createContext(),Nt=()=>useContext(Ie),qt=e=>{let[t]=a(),[n,o]=createSignal(null);return onMount(async()=>{e.id=e.id||createUniqueId();let r=t.mapLib.MercatorCoordinate.fromLngLat([e.origin[0]||0,e.origin[1]||0],e.origin[2]||0),i=r.meterInMercatorCoordinateUnits(),{x:a,y:s,z:c}=r,l=null,h=null,m=null;e.babylon?(h=await import('@babylonjs/core'),l=h.Matrix.Compose(new h.Vector3(i,i,i),h.Quaternion.FromEulerAngles(Math.PI/2,0,0),new h.Vector3(a,s,c))):(m=await import('three'),l={translateX:a,translateY:s,translateZ:c,rotateX:Math.PI/2,rotateY:0,rotateZ:0,scale:i}),t.map.addLayer({id:e.id,type:"custom",renderingMode:"3d",onAdd(b,d){if(e.babylon){let f=new h.Engine(d,true,{useHighPrecisionMatrix:true},true);this.scene=new h.Scene(f),this.scene.autoClear=false,this.scene.preventDefaultOnPointerDown=false,this.scene.preventDefaultOnPointerUp=false;let v=new h.UniversalCamera("Camera",h.Vector3.Zero());v.mode=h.Camera.ORTHOGRAPHIC_CAMERA,v.inertia=0,this.scene.ambientColor=new h.Color3(1,1,1),e.defaultLight&&new h.HemisphericLight("Light",new h.Vector3(100,10,0),this.scene);}else this.camera=new m.Camera,this.scene=new m.Scene,e.defaultLight&&(this.light=new m.DirectionalLight(16777215),this.light.position.set(100,0,0).normalize(),this.scene.add(this.light)),this.renderer=new m.WebGLRenderer({canvas:b.getCanvas(),context:d,antialias:true}),this.renderer.autoClear=false;this.map=b,e.onAdd&&e.onAdd(this.scene,this.map,d),o(this.scene);},render(b,d){if(e.babylon){this.scene.activeCamera.freezeProjectionMatrix(l.multiply(h.Matrix.FromArray(d)));this.map.getPitch()*(Math.PI/180);this.map.getBearing()*(Math.PI/180);this.scene.render(false);}else {let f=new m.Matrix4().makeRotationAxis(new m.Vector3(1,0,0),l.rotateX),v=new m.Matrix4().makeRotationAxis(new m.Vector3(0,1,0),l.rotateY),y=new m.Matrix4().makeRotationAxis(new m.Vector3(0,0,1),l.rotateZ),M=new m.Matrix4().fromArray(d),C=new m.Matrix4().makeTranslation(l.translateX,l.translateY,l.translateZ).scale(new m.Vector3(l.scale,-l.scale,l.scale)).multiply(f).multiply(v).multiply(y);this.camera.projectionMatrix=M.multiply(C),this.renderer.resetState(),this.renderer.render(this.scene,this.camera);}e.onRender&&e.onRender(b,d),t.map.triggerRepaint();}},e.beforeId);}),onCleanup(()=>{t.map.getLayer(e.id)&&t.map.removeLayer(e.id);}),createComponent(Ie.Provider,{value:n,get children(){return memo(()=>!!n())()&&e.children}})};var Yt=e=>{let[t]=a();return createEffect(()=>{t.isMapLibre?t.map.setSky?.(e.style||{}):t.map.setFog(e.style||{});}),onCleanup(()=>{t.isMapLibre?t.map.getSky?.()&&t.map.setSky(null):t.map.getFog()&&t.map.setFog(null);}),null};var Qt=e=>{let[t]=a(),n=V();return !n&&!e?.source&&(n=createUniqueId(),t.map.addSource(n,{type:"raster-dem",url:t.isMapLibre?"https://demotiles.maplibre.org/terrain-tiles/tiles.json":"mapbox://mapbox.terrain-rgb",tileSize:t.isMapLibre?256:512,maxzoom:t.isMapLibre?void 0:14}),t.map.sourceIdList.push(n)),createEffect(()=>{t.map.setTerrain({exaggeration:e.exaggeration||1,source:e?.source||n});}),onCleanup(()=>t.map?.setTerrain(null)),null};var X=(e,t)=>{let[n]=a();createEffect(()=>{let o=e(),r=t?.();o&&(n.map.hasControl(o)&&n.map.removeControl(o),n.map.addControl(o,r));}),onCleanup(()=>{let o=e();o&&n.map.hasControl(o)&&n.map.removeControl(o);});};var rn=e=>{let[t]=a(),[n,o]=splitProps(e,["position"]),[r,i]=createSignal(null),a$1=new Map([["navigation",t.mapLib.NavigationControl],["scale",t.mapLib.ScaleControl],["attribution",t.mapLib.AttributionControl],["geolocate",t.mapLib.GeolocateControl],["fullscreen",t.mapLib.FullscreenControl],["logo",t.mapLib.LogoControl],["terrain",t.mapLib.TerrainControl]]);return createEffect(()=>{untrack(()=>r()&&t.map.hasControl(r())&&t.map.removeControl(r())),i(o.custom||new(a$1.get(o.type||"navigation"))(o.options));}),X(r,()=>n.position),null};var ln=e=>{if(!e.lngLat)throw new Error("Marker - lngLat is required");let[t,n,o]=splitProps(e,["lngLat","children","showPopup","draggable"],["popup","onOpen","onClose"]),[r]=a(),i=null,a$1=null,s=t.lngLat;return createEffect(()=>{r.map&&(a$1?.remove(),a$1=new r.mapLib.Popup({closeOnClick:false,focusAfterOpen:false,...n.popup}).on("open",()=>n.onOpen?.()).on("close",()=>n.onClose?.()),createEffect(()=>{t.children!==void 0&&(typeof t.children=="string"?a$1?.setHTML(t.children):a$1?.setDOMContent(t.children),i?.setPopup(a$1));}),createEffect(()=>t.showPopup!==a$1?.isOpen()&&i?.togglePopup()));}),createEffect(()=>{r.map&&(i?.remove(),i=new r.mapLib.Marker(o.options).on("dragstart",()=>o.onDragStart?.()).on("dragend",()=>o.onDragEnd?.()).on("drag",()=>o.onDrag?.(i?.getLngLat().toArray())).setPopup(a$1).setLngLat(s).addTo(r.map),createEffect(()=>t.showPopup!==a$1?.isOpen()&&i?.togglePopup()));}),createEffect(()=>i?.setLngLat(t.lngLat)),createEffect(()=>i?.setDraggable(t.draggable)),onCleanup(()=>i?.remove()),null};var un=e=>{if(!e.trackPointer&&!e.lngLat)throw new Error("Popup - lngLat or trackPointer is required");let[t,n]=splitProps(e,["lngLat","children","trackPointer"]),[o]=a(),r;return createEffect(()=>{o.map&&(r?.remove(),r=new o.mapLib.Popup({closeOnClick:false,focusAfterOpen:false,...n.options}).on("open",()=>n.onOpen?.()).on("close",()=>n.onClose?.()).addTo(o.map),createEffect(()=>t.trackPointer?r.trackPointer():r.setLngLat(t.lngLat)),createEffect(()=>typeof t.children=="string"?r.setHTML(t.children):r.setDOMContent(t.children)));}),onCleanup(()=>r?.remove()),null};var ue=new Float64Array(256);for(let e=0;e<256;e++){let t=.5-Math.pow(e/255,.45454545454545453);ue[e]=t*Math.abs(t);}ue[255]=-1e20;function Te(e,t,n,o,r,i,a){i[0]=0,a[0]=-1e20,a[1]=1e20,r[0]=e[t];for(let s=1,c=0,l=0;s<o;s++){r[s]=e[t+s*n];let h=s*s;do{let m=i[c];l=(r[s]-r[m]+h-m*m)/(s-m)/2;}while(l<=a[c]&&--c>-1);c++,i[c]=s,a[c]=l,a[c+1]=1e20;}for(let s=0,c=0;s<o;s++){for(;a[c+1]<s;)c++;let l=i[c],h=s-l;e[t+s*n]=r[l]+h*h;}}function $e(e,t,n,o,r,i){for(let a=0;a<t;a++)Te(e,a,t,n,o,r,i);for(let a=0;a<n;a++)Te(e,a*t,1,t,o,r,i);}var me=({radius:e=8}={})=>Math.ceil(e);function W(e,{radius:t=8,cutoff:n=.25}={}){let{width:o,height:r}=e,i=o*r,a=new Float64Array(i).fill(1e20),s=new Float64Array(i),c=Math.max(o,r),l=new Float64Array(c),h=new Uint16Array(c),m=new Float64Array(c+1),b=e.data;for(let y=0,M=3;y<i;y++,M+=4){let C=b[M];if(C===0)continue;let P=ue[C];a[y]=Math.max(0,P),s[y]=Math.max(0,-P);}$e(a,o,r,l,h,m),$e(s,o,r,l,h,m);let d=255/t,f=255*(1-n),v=new Uint8ClampedArray(i*4);for(let y=0,M=0;y<i;y++,M+=4){let C=Math.sqrt(a[y])-Math.sqrt(s[y]),P=Math.max(0,Math.min(255,Math.round(f-d*C)));v[M]=v[M+1]=v[M+2]=255,v[M+3]=P;}return {width:o,height:r,data:v}}var pe={diagonal_l:{size:20,path:"M20 0 0 20M-10 10 10-10M10 30 30 10"},diagonal_r:{size:20,path:"M0 0 20 20M30 10 10-10M10 30-10 10"},horizontal:{size:14,path:"M7 0V20"},vertical:{size:14,path:"M0 7H20"},cross:{size:18,path:"M9 0V18M0 9H18"},hash:{size:30,path:"M15 0 30 15 15 30 0 15Z"},chevron_h:{size:20,path:"M-5 5 0 10 10 0 20 10 25 5M0 30 10 20 20 30"},chevron_v:{size:20,path:"M5-5 10 0 0 10 10 20 5 25M25 15 20 10 25 5"},square:{size:20,path:"M8 8H12V12H8Z",fill:true},hex:{size:50,path:"M0 0V50L50 25ZM50 0V50L0 25ZM25 0V50"},circle:{size:25,path:"M8 10A2.5 2.5 0 118.01 10M18 15A2.5 2.5 0 1018.01 15",fill:true},grid:{size:20,path:"M10 0V20M0 10H20"},brick:{size:40,path:"M0 0H40M0 20H40M0 40H40M0 0V20M20 0V20M40 0V20M10 20V40M30 20V40"},wave:{size:20,path:"M0 5Q5 0 10 5T20 5M0 15Q5 10 10 15T20 15"}},Ae=Object.keys(pe),k=e=>`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" stroke-linecap="round" stroke-linejoin="round">
|
|
7
|
+
<path d="${e}" fill="#000" stroke="#000" stroke-width="3"/>
|
|
8
|
+
</svg>`,ge={square:k("M3,3 L21,3 L21,21 L3,21 Z"),circle:k("M 12 4 A 1 1 0 0 0 12 20 A 1 1 0 0 0 12 4 Z"),triangle:k("M 12 2 L 22 19 H 2 Z"),diamond:k("M 12 1 L 19 12 L 12 23 L 5 12 Z"),pentagon:k("M12,3 L21,9 L17,19 L7,19 L3,9 Z"),hexagon:k("M12,3 L20,7.5 L20,16.5 L12,21 L4,16.5 L4,7.5 Z"),octagon:k("M 8 3 Q 12 3.3 16 3 Q 18.3 5.7 21 8 Q 20.7 12 21 16 Q 18.3 18.3 16 21 Q 12 20.7 8 21 Q 5.8 18.2 3 16 Q 3.3 12 3 8 Q 5.7 5.7 8 3 Z"),cross:k("M 10.5 3 h 3 v 7.5 h 7.5 v 3 h -7.5 v 7.5 h -3 v -7.5 h -7.5 v -3 h 7.5 Z"),x:k("M 18 4 L 20 6 L 14 12 L 20 18 L 18 20 L 12 14 L 6 20 L 4 18 L 10 12 L 4 6 L 6 4 L 12 10 Z"),star:k("M12,3 L14,9 L20.5,9 L15.5,13 L17.5,19.5 L12,15.5 L6.5,19.5 L8.5,13 L3.5,9 L10,9 Z"),heart:k("M 12 21 L 3 11 A 4.5 4.5 0 1 1 11 8 L 13 8 A 4.5 4.5 0 1 1 21 11 Z"),pin:k("M 12 21 L 7 11 A 6 6 0 0 1 12 2 A 6 6 0 0 1 17 11 Z"),drop:k("M 4 21 V 12 A 7.5 7.5 0 0 1 12 4 A 7.5 7.5 0 0 1 13 21 Z"),chevron:k("M 8 4 L 14 12 L 8 20 H 5 L 11 12 L 5 4 Z")},Fe=Object.keys(ge),De=e=>k(e);var hn=e=>{let[t]=a(),[n,o]=createSignal({width:0,height:0}),r=null,i=(l,h)=>{t.map.debug&&console.debug("%c[MapGL]","color: #10b981",l,h||"");},a$1=()=>{!r||!t.map||t.map.hasImage(e.id)||(t.map.addImage(e.id,r.data,r.ops),i("Re-Add Image:",e.id));};t.map.on("style.load",a$1),onCleanup(()=>{t.map?.off("style.load",a$1),t.map?.hasImage(e.id)&&t.map?.removeImage(e.id),i("Remove Image:",e.id);}),createEffect(()=>{if(!e.id)throw new Error("Image - ID is required");if(!e.source&&!e.pattern&&!e.symbol)throw new Error("Image - Image, Pattern or Symbol is required");let l=Math.max(1,Math.round(window.devicePixelRatio||2)),h=e.pattern?{pixelRatio:l,...e.options}:e.sdf?{...e.options,sdf:true}:e.options,m=e.symbol&&(ge[e.symbol]||(e.symbol.trimStart().startsWith("<svg")?e.symbol:De(e.symbol)));s(e.source||m||c(e.pattern,l),(b,d)=>{let f=d?{...h,pixelRatio:d}:h,{width:v,height:y}=b;t.map&&!t.map.hasImage(e.id)&&t.map.addImage(e.id,b,f),!e.pattern&&untrack(()=>v===n().width&&y===n().height)?(t.map.updateImage(e.id,b),t.map.triggerRepaint()):(t.map.removeImage(e.id),t.map.addImage(e.id,b,f)),o({width:v,height:y}),r={data:b,ops:f},i("Add Image:",e.id);});});let s=(l,h)=>{let m=e.sdf?typeof e.sdf=="object"?e.sdf:{}:null;if(typeof l=="string"&&l?.trimStart().startsWith("<svg")&&(l=new DOMParser().parseFromString(l,"image/svg+xml").childNodes[0]),l instanceof SVGElement&&(e.options?.fill&&l.setAttribute("fill",e.options.fill),e.options?.stroke&&l.setAttribute("stroke",e.options.stroke),l=new XMLSerializer().serializeToString(l)),typeof l!="string")return h(l);t.map.loadImage(l,async(b,d)=>{if(b){typeof l=="string"&&l?.trimEnd().endsWith(".svg")&&(l=await(await fetch(l)).text(),l=new DOMParser().parseFromString(l,"image/svg+xml").childNodes[0],l.setAttribute("fill",e.options.fill),l.setAttribute("stroke",e.options.stroke),l.setAttribute("transform",e.options.transform),l=new XMLSerializer().serializeToString(l));let f=new Image;f.crossOrigin="Anonymous",f.onload=()=>{let v=Math.min(f.width,f.height),y=v>0?Math.max(1,50/v):1,M=e.options?.pixelRatio??Math.max(1,Math.round(window.devicePixelRatio||1)),C=y*M,P=m?me(m)*C:0,u=Math.round(f.width*C),g=Math.round(f.height*C),p=document.createElement("canvas");p.width=u+P*2,p.height=g+P*2;let x=p.getContext("2d");x.imageSmoothingEnabled=true,x.drawImage(f,P,P,u,g);let E=x.getImageData(0,0,p.width,p.height);return h(m?W(E,m):E,C)},f.onerror=v=>console.error(`[MapGL] Image "${e.id}" failed to load:`,v),f.src=l.trimStart().startsWith("<svg")?"data:image/svg+xml;charset=utf-8,"+encodeURIComponent(l):l;}else {if(!m)return h(d);let{width:f,height:v}=d,y=me(m),M=document.createElement("canvas");M.width=f+y*2,M.height=v+y*2;let C=M.getContext("2d");C.imageSmoothingEnabled=true,"data"in d?C.putImageData(d,y,y):C.drawImage(d,y,y,f,v);let P=C.getImageData(0,0,M.width,M.height);return h(W(P,m))}});},c=(l,h=2)=>{let m=pe[l.type],b=m.size*h;return {width:b,height:b,data:new Uint8Array(b*b*4),onAdd:function(){let d=document.createElement("canvas");d.width=d.height=b,this.ctx=d.getContext("2d",{willReadFrequently:true}),this.ctx.scale(h,h);},render:function(){return this.ctx.fillStyle=l.background||"transparent",this.ctx.fillRect(0,0,m.size,m.size),this.ctx.strokeStyle=this.ctx.fillStyle=l.color||"black",this.ctx.lineWidth=l.lineWidth||1,this.ctx.stroke(new Path2D(m.path)),m.fill&&this.ctx.fill(new Path2D(m.path)),this.data=this.ctx.getImageData(0,0,this.width,this.height).data,true}}};return null};var Mn=(e,t,n)=>e.map((o,r)=>(1-n)*e[r]+n*t[r]),bn=(e,t,n)=>{let o=e.map((i,a)=>e[a]*t[a]).reduce((i,a)=>i+a),r=Math.acos(o);return e.map((i,a)=>Math.sin((1-n)*r)/Math.sin(r)*e[a]+Math.sin(n*r)/Math.sin(r)*t[a])},xn={in:e=>e*e,out:e=>1-(1-e)*(1-e),inOut:e=>e<.5?2*e*e:1-Math.pow(-2*e+2,2)/2},wn=e=>{let[t]=a(),n=.1,o=false,[r,i]=createSignal(false);["mousedown","touchstart","wheel"].forEach(d=>t.map.on(d,f=>!f.rotate&&i(true))),["moveend","mouseup","touchend"].forEach(d=>t.map.on(d,f=>!f.rotate&&i(false)));let a$1=async([d,f,v],y)=>{let M=t.map.getFreeCameraOptions();M.position=t.mapLib.MercatorCoordinate.fromLngLat([d,f],v),M.lookAtPoint(y),t.map.setFreeCameraOptions(M);},s=()=>{e.translate&&window.requestAnimationFrame(s);let d=[e.translate.start,e.translate.end,e.translate.easing?xn[e.translate.easing](n):n],f=e.translate.type==="line"?Mn(...d):bn(...d);a$1(f,e.translate.target),!e.translate.loop&&(n>1||n<0)&&(o=!o),n=o?n-.001:n+.001;};createEffect(()=>{e.translate&&window.requestAnimationFrame(s);});let c={duration:1e3,easing:d=>d},l=()=>{if(r())return;let{secPerRev:d=120,maxSpinZoom:f=5,slowSpinZoom:v=3}=e.rotateGlobe,y=t.map.getZoom();if(y>f)return;let M=360/d;y>v&&(M*=(f-y)/(f-v));let C=t.map.getCenter();C.lng=e.reverse?C.lng+M:C.lng-M,t.map.easeTo({center:C,...c},{rotate:true});},h=()=>{if(!e.rotateViewport||r()){t.map.stop();return}let d=e.rotateViewport,f=d?.secPerRev||60,v=e.reverse?t.map.getBearing()+360/f:t.map.getBearing()-360/f,y=d?.pitch||60,M=d?.around;t.map.easeTo({bearing:v,pitch:y,around:M,...c},{rotate:true});},m=()=>e.rotateGlobe?l():h();t.map.on("moveend",m).on("dragend",m);let b;return createEffect(()=>{e.rotateGlobe!=null&&(e.rotateGlobe?(b=t.map.getCenter(),l()):e.resetWhenStopped?t.map.stop().easeTo({center:b}):t.map.stop());}),createEffect(()=>{e.rotateViewport!=null&&(e.rotateViewport?h():e.resetWhenStopped?t.map.stop().resetNorthPitch():t.map.stop());}),onCleanup(()=>t.map.off("moveend",m).off("dragend",m)),e.children};var Sn=e=>{let[t]=a();return createEffect(()=>t.map.setLight(e.style||{})),onCleanup(()=>t.map?.setLight(null)),null};var j={};j.onSetup=function(e){var t={};return t.count=e.count||0,t};j.onClick=function(e,t){var n=this.newFeature({type:"Feature",properties:{count:e.count},geometry:{type:"Point",coordinates:[t.lngLat.lng,t.lngLat.lat]}});this.addFeature(n);};j.onKeyUp=function(e,t){if(t.keyCode===27)return this.changeMode("simple_select")};j.toDisplayFeatures=function(e,t,n){n(t);};var Oe=j;var Pn=6371.0088,En=1.609344,Re=6378137;function I(e){return e*Math.PI/180}function ze(e){return e*180/Math.PI}function kn(e,t){let n=I(t[1]-e[1]),o=I(t[0]-e[0]),r=I(e[1]),i=I(t[1]),a=Math.sin(n/2)**2+Math.cos(r)*Math.cos(i)*Math.sin(o/2)**2;return Pn*2*Math.asin(Math.sqrt(a))}function Z(e,t="kilometers"){let n=0;for(let o=1;o<e.length;o++)n+=kn(e[o-1],e[o]);return t==="miles"?n/En:n}function Ve(e,t){let n=I(e[1]),o=I(e[0]),r=I(t[1]),i=I(t[0]-e[0]),a=Math.cos(r)*Math.cos(i),s=Math.cos(r)*Math.sin(i),c=Math.atan2(Math.sin(n)+Math.sin(r),Math.sqrt((Math.cos(n)+a)**2+s**2)),l=o+Math.atan2(s,Math.cos(n)+a);return [ze(l),ze(c)]}function _n(e){let t=e.length;if(t<=2)return 0;let n=0;for(let o=0;o<t;o++){let r,i,a;o===t-2?(r=t-2,i=t-1,a=0):o===t-1?(r=t-1,i=0,a=1):(r=o,i=o+1,a=o+2),n+=(I(e[a][0])-I(e[r][0]))*Math.sin(I(e[i][1]));}return n*Re*Re/2}function Ue(e){return e.reduce((t,n,o)=>{let r=Math.abs(_n(n));return o===0?t+r:t-r},0)}function je(e){let t=e[0],n=0,o=0;for(let[c,l]of t)n+=c,o+=l;n/=t.length,o/=t.length;let r=0,i=0,a=0;for(let c=0;c<t.length-1;c++){let l=t[c][0]-n,h=t[c][1]-o,m=t[c+1][0]-n,b=t[c+1][1]-o,d=l*b-m*h;r+=(l+m)*d,i+=(h+b)*d,a+=d;}if(a===0)return [n,o];let s=1/(3*a);return [n+r*s,o+i*s]}var Ze=e=>new Intl.NumberFormat(void 0,{maximumFractionDigits:5}).format(e[0])+"\xB0 "+new Intl.NumberFormat(void 0,{maximumFractionDigits:5}).format(e[1])+"\xB0",$=(e,t)=>{let n=Z(e,window.navigator.language==="en-US"?"miles":"kilometers");return {type:"Feature",properties:{type:"measure",value:window.navigator.language==="en-US"?new Intl.NumberFormat(void 0,{style:"unit",maximumFractionDigits:2,unit:n<=1?"foot":"mile"}).format(n<=1?n*5280:n):new Intl.NumberFormat(void 0,{style:"unit",maximumFractionDigits:2,unit:n<=1?"meter":"kilometer"}).format(n<=1?n*1e3:n),...t},geometry:{type:"Point",coordinates:Ve(e[0],e[1])}}},H=(e,t)=>{let n=Ue(e);return {type:"Feature",properties:{type:"measure",value:window.navigator.language==="en-US"?new Intl.NumberFormat(void 0,{style:"unit",maximumFractionDigits:2,unit:n<=10.764?"foot":"mile"}).format(n<=10.764?n*10.764:n*1.0000003861)+"\xB2":new Intl.NumberFormat(void 0,{style:"unit",maximumFractionDigits:2,unit:n<=1e6?"meter":"kilometer"}).format(n<=1e6?n:n/1e6)+"\xB2",...t},geometry:{type:"Point",coordinates:je(e)}}};var Ne=e=>{let t=e.modes.draw_line_string;return {...t,onSetup:function(){let n=t.onSetup.call(this),o=this.newFeature({type:"Feature",properties:{type:"measure",value:"TTT"},geometry:{type:"Point",coordinates:[]}});return {...n,measure:o}},onMouseMove:function(n,o){if(t.onMouseMove.call(this,n,o),n.line.coordinates.length>=2){let r=$(n.line.coordinates);n.measure.properties.value=r.properties.value,n.measure.updateCoordinate("",r.geometry.coordinates[0],r.geometry.coordinates[1]);}},toDisplayFeatures:function(n,o,r){t.toDisplayFeatures.call(this,n,o,r),this.drawConfig.userProperties.showLength&&r(n.measure.toGeoJSON());}}};var qe=e=>{let t=e.modes.draw_point;return {...t,onSetup:function(){let n=t.onSetup.call(this);return n.point.properties={...n.point.properties,type:"measure",anchor:"bottom"},n},onMouseMove:function(n,{lngLat:o}){n.point.properties.value=Ze([o.lng,o.lat]),n.point.updateCoordinate("",o.lng,o.lat);},toDisplayFeatures:function(n,o,r){let i=o.properties.id===n.point.id;return o.properties.active=i?"":"false",r(o)}}};var Ge=e=>{let t=e.modes.draw_polygon;return {...t,toDisplayFeatures:function(n,o,r){let i=a=>{if(r(a),this.drawConfig.userProperties.showLength){let s=Array.isArray(a.geometry.coordinates[0][0])?a.geometry.coordinates[0]:a.geometry.coordinates;s.forEach((c,l)=>{!Array.isArray(c)||l==0||r($([s[l-1],c]));});}this.drawConfig.userProperties.showArea&&a.geometry.coordinates[0].length>=3&&r(H([a.geometry.coordinates[0]]));};t.toDisplayFeatures.call(this,n,o,i);}}};function In(e,t,n,o){return {type:"Feature",properties:{meta:"vertex",parent:e,coord_path:n,active:o?"true":"false"},geometry:{type:"Point",coordinates:t}}}function Tn(e,t,n,o=64){let r=[],i=t/(111.32*Math.cos(e[1]*Math.PI/180)),a=t/110.574;for(let s=0;s<o;s+=1){let c=s/o*(2*Math.PI),l=i*Math.cos(c),h=a*Math.sin(c);r.push([e[0]+l,e[1]+h]);}return r.push(r[0]),{type:"Feature",geometry:{type:"Polygon",coordinates:[r]},properties:{parent:n,active:"true"}}}var $n={enable:e=>{setTimeout(()=>{!e.map||!e.map.doubleClickZoom||!e._ctx||!e._ctx.store||!e._ctx.store.getInitialConfigValue||e._ctx.store.getInitialConfigValue("doubleClickZoom")&&e.map.doubleClickZoom.enable();},0);}},An=e=>({...e.modes.draw_line_string,clickAnywhere:function(t,n){return t.currentVertexPosition===1?(t.line.addCoordinate(0,n.lngLat.lng,n.lngLat.lat),this.changeMode("simple_select",{featureIds:[t.line.id]})):(this.updateUIClasses({mouse:"add"}),t.line.updateCoordinate(t.currentVertexPosition,n.lngLat.lng,n.lngLat.lat),t.direction==="forward"?(t.currentVertexPosition+=1,t.line.updateCoordinate(t.currentVertexPosition,n.lngLat.lng,n.lngLat.lat)):t.line.addCoordinate(0,n.lngLat.lng,n.lngLat.lat),null)},onStop:function(t){if($n.enable(this),this.activateUIButton(),this.getFeature(t.line.id)!==void 0)if(t.line.removeCoordinate("0"),t.line.isValid()){let n=t.line.toGeoJSON(),o=(Z(n.geometry.coordinates)*1e3).toFixed(1),r=n.geometry.coordinates[0];this.deleteFeature([t.line.id],{silent:true});let i=this.newFeature({type:"Feature",properties:{radius:o},geometry:{type:"Point",coordinates:r}});this.addFeature(i),this.map.fire("draw.create",{features:[i.toGeoJSON()]}),this.changeMode("simple_select",{featureIds:[i.id]});}else this.deleteFeature([t.line.id],{silent:true}),this.changeMode("simple_select",{},{silent:true});},toDisplayFeatures:function(t,n,o){let r=n.properties.id===t.line.id;return n.properties.active=r?"true":"false",r?(n.geometry.coordinates.length<2||(n.properties.meta="feature",o(In(t.line.id,n.geometry.coordinates[t.direction==="forward"?n.geometry.coordinates.length-2:1],`${t.direction==="forward"?n.geometry.coordinates.length-2:1}`,false)),o(n),o($(n.geometry.coordinates,{parent:t.line.id})),o(Tn(n.geometry.coordinates[0],Z(n.geometry.coordinates),t.line.id))),null):o(n)}}),Be=An;var Fn=e=>({...e.modes.draw_line_string,onSetup:function(t){let n=e.modes.draw_line_string.onSetup.call(this,t),o=this.newFeature({type:"Feature",properties:{},geometry:{type:"Polygon",coordinates:[[]]}});return this.addFeature(o),{...n,...t,rectangle:o}},onTap:function(t,n){t.startPoint&&this.onMouseMove(t,n),this.onClick(t,n);},onClick:function(t,n){t.startPoint&&t.startPoint[0]!==n.lngLat.lng&&t.startPoint[1]!==n.lngLat.lat?(this.updateUIClasses({mouse:"pointer"}),t.endPoint=[n.lngLat.lng,n.lngLat.lat],this.changeMode("simple_select",{featuresId:t.rectangle.id})):t.startPoint=[n.lngLat.lng,n.lngLat.lat];},onMouseMove:function(t,n){t.startPoint&&(t.rectangle.updateCoordinate("0.0",t.startPoint[0],t.startPoint[1]),t.rectangle.updateCoordinate("0.1",n.lngLat.lng,t.startPoint[1]),t.rectangle.updateCoordinate("0.2",n.lngLat.lng,n.lngLat.lat),t.rectangle.updateCoordinate("0.3",t.startPoint[0],n.lngLat.lat),t.rectangle.updateCoordinate("0.4",t.startPoint[0],t.startPoint[1]));},onKeyUp:function(t,n){if(n.keyCode===27)return this.changeMode("simple_select")},onStop:function(t){e.modes.draw_line_string.onStop.call(this,t),this.getFeature(t.rectangle.id)!==void 0&&(t.rectangle.removeCoordinate("0.4"),t.rectangle.isValid()?this.map.fire("draw.create",{features:[t.rectangle.toGeoJSON()]}):(this.deleteFeature([t.rectangle.id],{silent:true}),this.changeMode("simple_select",{},{silent:true})));},toDisplayFeatures:function(t,n,o){let r=n.properties.id===t.rectangle.id;if(n.properties.active=r?"true":"false",!r)return o(n);if(t.startPoint)return o(n),this.drawConfig.userProperties.showLength&&(o($([n.geometry.coordinates[0][0],n.geometry.coordinates[0][1]],{parent:t.rectangle.id,anchor:"bottom"})),o($([n.geometry.coordinates[0][1],n.geometry.coordinates[0][2]],{parent:t.rectangle.id,anchor:"left"}))),this.drawConfig.userProperties.showArea&&o(H(n.geometry.coordinates,{parent:t.rectangle.id})),null},onTrash:function(t){this.deleteFeature([t.rectangle.id],{silent:true}),this.changeMode("simple_select");}}),Ye=Fn;var Xe={enable:e=>{setTimeout(()=>{!e.map||!e.map.doubleClickZoom||!e._ctx||!e._ctx.store||!e._ctx.store.getInitialConfigValue||e._ctx.store.getInitialConfigValue("doubleClickZoom")&&e.map.doubleClickZoom.enable();},0);},disable(e){setTimeout(()=>{!e.map||!e.map.doubleClickZoom||e.map.doubleClickZoom.disable();},0);}},Dn={onSetup:function(e){let t=this.newFeature({type:"Feature",properties:{},geometry:{type:"Polygon",coordinates:[[]]}});return this.addFeature(t),this.clearSelectedFeatures(),Xe.disable(this),this.updateUIClasses({mouse:"add"}),this.setActionableState({trash:true}),{rectangle:t,currentVertexPosition:0}},onTap:function(e,t){this.onClick(e,t);},onClick:function(e,t){if(e.currentVertexPosition===2){let n=this.calculatepXY3(e,t,false);return n&&e.rectangle.updateCoordinate(`0.${e.currentVertexPosition+1}`,n[0],n[1]),this.updateUIClasses({mouse:"pointer"}),this.changeMode("simple_select",{featuresId:e.rectangle.id})}else e.rectangle.updateCoordinate(`0.${e.currentVertexPosition}`,t.lngLat.lng,t.lngLat.lat),e.currentVertexPosition++,e.rectangle.updateCoordinate(`0.${e.currentVertexPosition}`,t.lngLat.lng,t.lngLat.lat);},onMouseMove:function(e,t){if(e.rectangle.updateCoordinate("0."+e.currentVertexPosition,t.lngLat.lng,t.lngLat.lat),e.currentVertexPosition&&e.currentVertexPosition>0&&this.calculateOrientedAnglePolygon(e),e.currentVertexPosition===2){let n=this.calculatepXY3(e,t,true);n&&e.rectangle.updateCoordinate("0."+(e.currentVertexPosition+1),n[0],n[1]);}},deegrees2meters(e){let t=e[0]*2003750834e-2/180,n=Math.log(Math.tan((90+e[1])*Math.PI/360))/(Math.PI/180);return n=n*2003750834e-2/180,[t,n]},meters2degress(e){let t=e[0]*180/2003750834e-2,n=Math.atan(Math.exp(e[1]*Math.PI/2003750834e-2))*360/Math.PI-90;return [t,n]},calculateOrientedAnglePolygon:function(e){let t=e.rectangle.getCoordinate("0.0"),n=this.deegrees2meters(t),o=e.rectangle.getCoordinate("0.1"),r=this.deegrees2meters(o),a=-1*(Math.atan2(r[1]-n[1],r[0]-n[0])*180/Math.PI+90),s=a<0?a+360:a;e.angle=parseFloat(s.toFixed(2));},calculatepXY3:function(e,t,n){let o=e.rectangle.getCoordinate("0.0"),r=this.deegrees2meters(o),i=e.rectangle.getCoordinate("0.1"),a=this.deegrees2meters(i),s=this.deegrees2meters([t.lngLat.lng,t.lngLat.lat]),c=this.deegrees2meters([t.lngLat.lng,t.lngLat.lat]);if(r[0]===a[0])s=[c[0],a[1]];else if(r[1]===a[1])s=[a[0],c[1]];else {let f=-1/((a[1]-r[1])/(a[0]-r[0]));Math.abs(f)<1?s[1]=f*(c[0]-a[0])+a[1]:s[0]=a[0]+(s[1]-a[1])/f;}let l=[a[0]-r[0],a[1]-r[1]],h=[s[0]-l[0],s[1]-l[1]],m=this.meters2degress(s),b=this.meters2degress(h);return e.rectangle.updateCoordinate("0.2",m[0],m[1]),e.rectangle.updateCoordinate("0.3",b[0],b[1]),b},onKeyUp:function(e,t){if(t.keyCode===27)return this.changeMode("simple_select")},onStop:function(e){Xe.enable(this),this.updateUIClasses({mouse:"none"}),this.activateUIButton(),this.getFeature(e.rectangle.id)!==void 0&&(e.rectangle.removeCoordinate("0.4"),e.rectangle.isValid()?this.map.fire("draw.create",{features:[e.rectangle.toGeoJSON()]}):(this.deleteFeature([e.rectangle.id],{silent:true}),this.changeMode("simple_select",{},{silent:true})));},toDisplayFeatures:function(e,t,n){let o=t.properties.id===e.rectangle.id;if(t.properties.active=o?"true":"false",t.properties.angle=e.angle,t.angle=e.angle,!o)return n(t);let r=t.geometry.coordinates[0].length;if(r<3){let i=t.geometry.coordinates[0][0],a={type:"Feature",properties:t.properties,angle:e.angle,geometry:{coordinates:t.geometry.coordinates[0][0],type:"Point"}};i&&n(a);return}if(r>=3&&r<=4){let i=[[t.geometry.coordinates[0][0][0],t.geometry.coordinates[0][0][1]],[t.geometry.coordinates[0][1][0],t.geometry.coordinates[0][1][1]]];if(n({type:"Feature",properties:t.properties,angle:e.angle,geometry:{coordinates:i,type:"LineString"}}),r===3)return}return n(t)},onTrash:function(e){this.deleteFeature([e.rectangle.id],{silent:true}),this.changeMode("simple_select");}},We=Dn;var He=[{id:"measure-label",type:"symbol",filter:["all",["==","$type","Point"],["==","user_type","measure"]],layout:{"text-field":["get","user_value"],"text-anchor":["get","user_anchor"],"text-offset":["match",["get","user_anchor"],"bottom",[0,-0.5],[0,0]],"text-size":12,"text-allow-overlap":true,"text-ignore-placement":true},paint:{"text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2,"text-halo-blur":1,"text-color":"#000"}}];var Rn=e=>{let[t]=a();t.isMapLibre&&e.lib.constants?.classes&&Object.assign(e.lib.constants.classes,{CANVAS:"maplibregl-canvas",CONTROL_BASE:"maplibregl-ctrl",CONTROL_PREFIX:"maplibregl-ctrl-",CONTROL_GROUP:"maplibregl-ctrl-group",ATTRIBUTION:"maplibregl-ctrl-attrib"});let n=new e.lib({styles:[...e.lib.lib.theme,...He],modes:{...e.lib.modes,draw_point:qe(e.lib),draw_line_string:Ne(e.lib),draw_polygon:Ge(e.lib),multi_point:Oe,radius:Be(e.lib),rectangle:Ye(e.lib),rectangle_assisted:We},userProperties:{showLength:e.showLength||false,showArea:e.showArea||false},...e.options});t.map.addControl(n,e.position||"top-right"),e.getInstance&&e.getInstance(n);let o={};return Me.forEach(r=>{if(e[r]){let i=`draw.${r.slice(2).toLowerCase()}`,a=s=>e[r](s);o[i]=a,t.map.on(i,a);}}),onCleanup(()=>{Object.keys(o).forEach(r=>t.map.off(r,o[r])),t.map?.removeControl(n);}),null};var Vn=e=>{let[t]=a(),n;return X(()=>(n||(n=new e.overlay(e.props||{})),n)),createEffect(()=>n?.setProps(e.props||{})),null};
|
|
9
|
+
|
|
10
|
+
export { Yt as Atmosphere, wn as Camera, rn as Control, Vn as DeckOverlay, Rn as Draw, hn as Image, Ft as Layer, qt as Layer3D, Sn as Light, ln as Marker, un as Popup, Mt as Source, Qt as Terrain, pt as default, ne as disableRasterFade, Ae as patternList, q as settleAfterIdle, Fe as symbolList, W as toSDF, Nt as useScene, V as useSourceId, G as waitForIdleAndSettle };
|