UNPKG

94.6 kBTypeScriptView Raw
1// Type definitions for Mapbox GL JS 2.7
2// Project: https://github.com/mapbox/mapbox-gl-js
3// Definitions by: Dominik Bruderer <https://github.com/dobrud>
4// Karl-Aksel Puulmann <https://github.com/macobo>
5// Dmytro Gokun <https://github.com/dmytro-gokun>
6// Liam Clarke <https://github.com/LiamAttClarke>
7// Vladimir Dashukevich <https://github.com/life777>
8// André Fonseca <https://github.com/amxfonseca>
9// makspetrov <https://github.com/Nosfit>
10// Michael Bullington <https://github.com/mbullington>
11// Olivier Pascal <https://github.com/pascaloliv>
12// Marko Schilde <https://github.com/mschilde>
13// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
14// TypeScript Version: 3.0
15
16/// <reference types="geojson" />
17
18export = mapboxgl;
19export as namespace mapboxgl;
20
21declare namespace mapboxgl {
22 let accessToken: string;
23 let version: string;
24 let baseApiUrl: string;
25
26 /**
27 * Number of web workers instantiated on a page with GL JS maps.
28 * By default, it is set to half the number of CPU cores (capped at 6).
29 */
30 let workerCount: number;
31
32 /**
33 * Maximum number of images (raster tiles, sprites, icons) to load in parallel, which affects performance in raster-heavy maps.
34 * 16 by default.
35 */
36 let maxParallelImageRequests: number;
37
38 export function supported(options?: { failIfMajorPerformanceCaveat?: boolean | undefined }): boolean;
39
40 /**
41 * Clears browser storage used by this library. Using this method flushes the Mapbox tile cache that is managed by this library.
42 * Tiles may still be cached by the browser in some cases.
43 */
44 export function clearStorage(callback?: (err?: Error) => void): void;
45
46 export function setRTLTextPlugin(pluginURL: string, callback: (error: Error) => void, deferred?: boolean): void;
47 export function getRTLTextPluginStatus(): PluginStatus;
48
49 /**
50 * Initializes resources like WebWorkers that can be shared across maps to lower load
51 * times in some situations. `mapboxgl.workerUrl` and `mapboxgl.workerCount`, if being
52 * used, must be set before `prewarm()` is called to have an effect.
53 *
54 * By default, the lifecycle of these resources is managed automatically, and they are
55 * lazily initialized when a Map is first created. By invoking `prewarm()`, these
56 * resources will be created ahead of time, and will not be cleared when the last Map
57 * is removed from the page. This allows them to be re-used by new Map instances that
58 * are created later. They can be manually cleared by calling
59 * `mapboxgl.clearPrewarmedResources()`. This is only necessary if your web page remains
60 * active but stops using maps altogether.
61 *
62 * This is primarily useful when using GL-JS maps in a single page app, wherein a user
63 * would navigate between various views that can cause Map instances to constantly be
64 * created and destroyed.
65 */
66 export function prewarm(): void;
67
68 /**
69 * Clears up resources that have previously been created by `mapboxgl.prewarm()`.
70 * Note that this is typically not necessary. You should only call this function
71 * if you expect the user of your app to not return to a Map view at any point
72 * in your application.
73 */
74 export function clearPrewarmedResources(): void;
75
76 type PluginStatus = 'unavailable' | 'loading' | 'loaded' | 'error';
77
78 type LngLatLike = [number, number] | LngLat | { lng: number; lat: number } | { lon: number; lat: number };
79
80 type LngLatBoundsLike = LngLatBounds | [LngLatLike, LngLatLike] | [number, number, number, number] | LngLatLike;
81 type PointLike = Point | [number, number];
82 type Offset = number | PointLike | { [_: string]: PointLike };
83
84 type ExpressionName =
85 // Types
86 | 'array'
87 | 'boolean'
88 | 'collator'
89 | 'format'
90 | 'literal'
91 | 'number'
92 | 'number-format'
93 | 'object'
94 | 'string'
95 | 'image'
96 | 'to-boolean'
97 | 'to-color'
98 | 'to-number'
99 | 'to-string'
100 | 'typeof'
101 // Feature data
102 | 'feature-state'
103 | 'geometry-type'
104 | 'id'
105 | 'line-progress'
106 | 'properties'
107 // Lookup
108 | 'at'
109 | 'get'
110 | 'has'
111 | 'in'
112 | 'index-of'
113 | 'length'
114 | 'slice'
115 // Decision
116 | '!'
117 | '!='
118 | '<'
119 | '<='
120 | '=='
121 | '>'
122 | '>='
123 | 'all'
124 | 'any'
125 | 'case'
126 | 'match'
127 | 'coalesce'
128 | 'within'
129 // Ramps, scales, curves
130 | 'interpolate'
131 | 'interpolate-hcl'
132 | 'interpolate-lab'
133 | 'step'
134 // Variable binding
135 | 'let'
136 | 'var'
137 // String
138 | 'concat'
139 | 'downcase'
140 | 'is-supported-script'
141 | 'resolved-locale'
142 | 'upcase'
143 // Color
144 | 'rgb'
145 | 'rgba'
146 | 'to-rgba'
147 // Math
148 | '-'
149 | '*'
150 | '/'
151 | '%'
152 | '^'
153 | '+'
154 | 'abs'
155 | 'acos'
156 | 'asin'
157 | 'atan'
158 | 'ceil'
159 | 'cos'
160 | 'e'
161 | 'floor'
162 | 'ln'
163 | 'ln2'
164 | 'log10'
165 | 'log2'
166 | 'max'
167 | 'min'
168 | 'pi'
169 | 'round'
170 | 'sin'
171 | 'sqrt'
172 | 'tan'
173 // Zoom, Heatmap
174 | 'zoom'
175 | 'heatmap-density';
176
177 type Expression = [ExpressionName, ...any[]];
178
179 type Anchor =
180 | 'center'
181 | 'left'
182 | 'right'
183 | 'top'
184 | 'bottom'
185 | 'top-left'
186 | 'top-right'
187 | 'bottom-left'
188 | 'bottom-right';
189
190 type DragPanOptions = {
191 linearity?: number;
192 easing?: (t: number) => number;
193 deceleration?: number;
194 maxSpeed?: number;
195 };
196
197 type InteractiveOptions = { around?: 'center' };
198
199 /**
200 * Map
201 */
202 export class Map extends Evented {
203 constructor(options?: MapboxOptions);
204
205 addControl(
206 control: Control | IControl,
207 position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left',
208 ): this;
209
210 removeControl(control: Control | IControl): this;
211
212 /**
213 * Checks if a control exists on the map.
214 *
215 * @param {IControl} control The {@link IControl} to check.
216 * @returns {boolean} True if map contains control.
217 * @example
218 */
219 hasControl(control: IControl): boolean;
220
221 resize(eventData?: EventData): this;
222
223 getBounds(): LngLatBounds;
224
225 getMaxBounds(): LngLatBounds | null;
226
227 setMaxBounds(lnglatbounds?: LngLatBoundsLike): this;
228
229 setMinZoom(minZoom?: number | null): this;
230
231 getMinZoom(): number;
232
233 setMaxZoom(maxZoom?: number | null): this;
234
235 getMaxZoom(): number;
236
237 setMinPitch(minPitch?: number | null): this;
238
239 getMinPitch(): number;
240
241 setMaxPitch(maxPitch?: number | null): this;
242
243 getMaxPitch(): number;
244
245 getRenderWorldCopies(): boolean;
246
247 setRenderWorldCopies(renderWorldCopies?: boolean): this;
248
249 project(lnglat: LngLatLike): mapboxgl.Point;
250
251 unproject(point: PointLike): mapboxgl.LngLat;
252
253 isMoving(): boolean;
254
255 isZooming(): boolean;
256
257 isRotating(): boolean;
258
259 /**
260 * Returns an array of GeoJSON Feature objects representing visible features that satisfy the query parameters.
261 *
262 * The properties value of each returned feature object contains the properties of its source feature. For GeoJSON sources, only string and numeric property values are supported (i.e. null, Array, and Object values are not supported).
263 *
264 * Each feature includes top-level layer, source, and sourceLayer properties. The layer property is an object representing the style layer to which the feature belongs. Layout and paint properties in this object contain values which are fully evaluated for the given zoom level and feature.
265 *
266 * Only features that are currently rendered are included. Some features will not be included, like:
267 *
268 * - Features from layers whose visibility property is "none".
269 * - Features from layers whose zoom range excludes the current zoom level.
270 * - Symbol features that have been hidden due to text or icon collision.
271 *
272 * Features from all other layers are included, including features that may have no visible contribution to the rendered result; for example, because the layer's opacity or color alpha component is set to 0.
273 *
274 * The topmost rendered feature appears first in the returned array, and subsequent features are sorted by descending z-order. Features that are rendered multiple times (due to wrapping across the antimeridian at low zoom levels) are returned only once (though subject to the following caveat).
275 *
276 * Because features come from tiled vector data or GeoJSON data that is converted to tiles internally, feature geometries may be split or duplicated across tile boundaries and, as a result, features may appear multiple times in query results. For example, suppose there is a highway running through the bounding rectangle of a query. The results of the query will be those parts of the highway that lie within the map tiles covering the bounding rectangle, even if the highway extends into other tiles, and the portion of the highway within each map tile will be returned as a separate feature. Similarly, a point feature near a tile boundary may appear in multiple tiles due to tile buffering.
277 *
278 * @param pointOrBox The geometry of the query region: either a single point or southwest and northeast points describing a bounding box. Omitting this parameter (i.e. calling Map#queryRenderedFeatures with zero arguments, or with only a options argument) is equivalent to passing a bounding box encompassing the entire map viewport.
279 * @param options
280 */
281 queryRenderedFeatures(
282 pointOrBox?: PointLike | [PointLike, PointLike],
283 options?: { layers?: string[] | undefined; filter?: any[] | undefined } & FilterOptions,
284 ): MapboxGeoJSONFeature[];
285
286 /**
287 * Returns an array of GeoJSON Feature objects representing features within the specified vector tile or GeoJSON source that satisfy the query parameters.
288 *
289 * In contrast to Map#queryRenderedFeatures, this function returns all features matching the query parameters, whether or not they are rendered by the current style (i.e. visible). The domain of the query includes all currently-loaded vector tiles and GeoJSON source tiles: this function does not check tiles outside the currently visible viewport.
290 *
291 * Because features come from tiled vector data or GeoJSON data that is converted to tiles internally, feature geometries may be split or duplicated across tile boundaries and, as a result, features may appear multiple times in query results. For example, suppose there is a highway running through the bounding rectangle of a query. The results of the query will be those parts of the highway that lie within the map tiles covering the bounding rectangle, even if the highway extends into other tiles, and the portion of the highway within each map tile will be returned as a separate feature. Similarly, a point feature near a tile boundary may appear in multiple tiles due to tile buffering.
292 *
293 * @param sourceID The ID of the vector tile or GeoJSON source to query.
294 * @param parameters
295 */
296 querySourceFeatures(
297 sourceID: string,
298 parameters?: {
299 sourceLayer?: string | undefined;
300 filter?: any[] | undefined;
301 } & FilterOptions,
302 ): MapboxGeoJSONFeature[];
303
304 setStyle(
305 style: mapboxgl.Style | string,
306 options?: { diff?: boolean | undefined; localIdeographFontFamily?: string | undefined },
307 ): this;
308
309 getStyle(): mapboxgl.Style;
310
311 isStyleLoaded(): boolean;
312
313 addSource(id: string, source: AnySourceData): this;
314
315 isSourceLoaded(id: string): boolean;
316
317 areTilesLoaded(): boolean;
318
319 removeSource(id: string): this;
320
321 getSource(id: string): AnySourceImpl;
322
323 addImage(
324 name: string,
325 image:
326 | HTMLImageElement
327 | ArrayBufferView
328 | { width: number; height: number; data: Uint8Array | Uint8ClampedArray }
329 | ImageData
330 | ImageBitmap,
331 options?: { pixelRatio?: number | undefined; sdf?: boolean | undefined, stretchX?: [number, number][] | undefined, stretchY?: [number, number][] | undefined, content?: [number, number, number, number] | undefined },
332 ): void;
333
334 updateImage(
335 name: string,
336 image:
337 | HTMLImageElement
338 | ArrayBufferView
339 | { width: number; height: number; data: Uint8Array | Uint8ClampedArray }
340 | ImageData
341 | ImageBitmap,
342 ): void;
343
344 hasImage(name: string): boolean;
345
346 removeImage(name: string): void;
347
348 loadImage(url: string, callback: (error?: Error, result?: HTMLImageElement | ImageBitmap) => void): void;
349
350 listImages(): string[];
351
352 addLayer(layer: mapboxgl.AnyLayer, before?: string): this;
353
354 moveLayer(id: string, beforeId?: string): this;
355
356 removeLayer(id: string): this;
357
358 getLayer(id: string): mapboxgl.AnyLayer;
359
360 setFilter(layer: string, filter?: any[] | boolean | null, options?: FilterOptions | null): this;
361
362 setLayerZoomRange(layerId: string, minzoom: number, maxzoom: number): this;
363
364 getFilter(layer: string): any[];
365
366 setPaintProperty(layer: string, name: string, value: any, options?: FilterOptions): this;
367
368 getPaintProperty(layer: string, name: string): any;
369
370 setLayoutProperty(layer: string, name: string, value: any, options?: FilterOptions): this;
371
372 getLayoutProperty(layer: string, name: string): any;
373
374 setLight(light: mapboxgl.Light, options?: FilterOptions): this;
375
376 getLight(): mapboxgl.Light;
377
378 /**
379 * Sets the terrain property of the style.
380 *
381 * @param terrain Terrain properties to set. Must conform to the [Mapbox Style Specification](https://www.mapbox.com/mapbox-gl-style-spec/#terrain).
382 * If `null` or `undefined` is provided, function removes terrain.
383 * @returns {Map} `this`
384 * @example
385 * map.addSource('mapbox-dem', {
386 * 'type': 'raster-dem',
387 * 'url': 'mapbox://mapbox.mapbox-terrain-dem-v1',
388 * 'tileSize': 512,
389 * 'maxzoom': 14
390 * });
391 * // add the DEM source as a terrain layer with exaggerated height
392 * map.setTerrain({ 'source': 'mapbox-dem', 'exaggeration': 1.5 });
393 */
394 setTerrain(terrain?: TerrainSpecification | null): this;
395
396 getTerrain(): TerrainSpecification | null;
397
398 showTerrainWireframe: boolean;
399
400 /**
401 *
402 * @param lngLat The coordinate to query
403 * @param options Optional {ElevationQueryOptions}
404 * @returns The elevation in meters at mean sea level or null
405 */
406 queryTerrainElevation(lngLat: mapboxgl.LngLatLike, options?: ElevationQueryOptions): number | null;
407
408 setFeatureState(
409 feature: FeatureIdentifier | mapboxgl.MapboxGeoJSONFeature,
410 state: { [key: string]: any },
411 ): void;
412
413 getFeatureState(feature: FeatureIdentifier | mapboxgl.MapboxGeoJSONFeature): { [key: string]: any };
414
415 removeFeatureState(target: FeatureIdentifier | mapboxgl.MapboxGeoJSONFeature, key?: string): void;
416
417 getContainer(): HTMLElement;
418
419 getCanvasContainer(): HTMLElement;
420
421 getCanvas(): HTMLCanvasElement;
422
423 loaded(): boolean;
424
425 remove(): void;
426
427 triggerRepaint(): void;
428
429 showTileBoundaries: boolean;
430
431 showCollisionBoxes: boolean;
432
433 /**
434 * Gets and sets a Boolean indicating whether the map will visualize
435 * the padding offsets.
436 *
437 * @name showPadding
438 * @instance
439 * @memberof Map
440 */
441 showPadding: boolean;
442
443 repaint: boolean;
444
445 getCenter(): mapboxgl.LngLat;
446
447 setCenter(center: LngLatLike, eventData?: mapboxgl.EventData): this;
448
449 panBy(offset: PointLike, options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
450
451 panTo(lnglat: LngLatLike, options?: mapboxgl.AnimationOptions, eventdata?: mapboxgl.EventData): this;
452
453 getZoom(): number;
454
455 setZoom(zoom: number, eventData?: mapboxgl.EventData): this;
456
457 zoomTo(zoom: number, options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
458
459 zoomIn(options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
460
461 zoomOut(options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
462
463 getBearing(): number;
464
465 setBearing(bearing: number, eventData?: mapboxgl.EventData): this;
466
467 /**
468 * Returns the current padding applied around the map viewport.
469 *
470 * @memberof Map#
471 * @returns The current padding around the map viewport.
472 */
473 getPadding(): PaddingOptions;
474
475 /**
476 * Sets the padding in pixels around the viewport.
477 *
478 * Equivalent to `jumpTo({padding: padding})`.
479 *
480 * @memberof Map#
481 * @param padding The desired padding. Format: { left: number, right: number, top: number, bottom: number }
482 * @param eventData Additional properties to be added to event objects of events triggered by this method.
483 * @fires movestart
484 * @fires moveend
485 * @returns {Map} `this`
486 * @example
487 * // Sets a left padding of 300px, and a top padding of 50px
488 * map.setPadding({ left: 300, top: 50 });
489 */
490 setPadding(padding: PaddingOptions, eventData?: EventData): this;
491
492 rotateTo(bearing: number, options?: mapboxgl.AnimationOptions, eventData?: EventData): this;
493
494 resetNorth(options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
495
496 resetNorthPitch(options?: mapboxgl.AnimationOptions | null, eventData?: mapboxgl.EventData | null): this;
497
498 snapToNorth(options?: mapboxgl.AnimationOptions, eventData?: mapboxgl.EventData): this;
499
500 getPitch(): number;
501
502 setPitch(pitch: number, eventData?: EventData): this;
503
504 cameraForBounds(bounds: LngLatBoundsLike, options?: CameraForBoundsOptions): CameraForBoundsResult | undefined;
505
506 fitBounds(bounds: LngLatBoundsLike, options?: mapboxgl.FitBoundsOptions, eventData?: mapboxgl.EventData): this;
507
508 fitScreenCoordinates(
509 p0: PointLike,
510 p1: PointLike,
511 bearing: number,
512 options?: AnimationOptions & CameraOptions,
513 eventData?: EventData,
514 ): this;
515
516 jumpTo(options: mapboxgl.CameraOptions, eventData?: mapboxgl.EventData): this;
517
518 /**
519 * Returns position and orientation of the camera entity.
520 *
521 * @memberof Map#
522 * @returns {FreeCameraOptions} The camera state
523 */
524 getFreeCameraOptions(): FreeCameraOptions;
525
526 /**
527 * FreeCameraOptions provides more direct access to the underlying camera entity.
528 * For backwards compatibility the state set using this API must be representable with
529 * `CameraOptions` as well. Parameters are clamped into a valid range or discarded as invalid
530 * if the conversion to the pitch and bearing presentation is ambiguous. For example orientation
531 * can be invalid if it leads to the camera being upside down, the quaternion has zero length,
532 * or the pitch is over the maximum pitch limit.
533 *
534 * @memberof Map#
535 * @param {FreeCameraOptions} options FreeCameraOptions object
536 * @param eventData Additional properties to be added to event objects of events triggered by this method.
537 * @fires movestart
538 * @fires zoomstart
539 * @fires pitchstart
540 * @fires rotate
541 * @fires move
542 * @fires zoom
543 * @fires pitch
544 * @fires moveend
545 * @fires zoomend
546 * @fires pitchend
547 * @returns {Map} `this`
548 */
549 setFreeCameraOptions(options: FreeCameraOptions, eventData?: Object): this;
550
551 easeTo(options: mapboxgl.EaseToOptions, eventData?: mapboxgl.EventData): this;
552
553 flyTo(options: mapboxgl.FlyToOptions, eventData?: mapboxgl.EventData): this;
554
555 isEasing(): boolean;
556
557 stop(): this;
558
559 on<T extends keyof MapLayerEventType>(
560 type: T,
561 layer: string | ReadonlyArray<string>,
562 listener: (ev: MapLayerEventType[T] & EventData) => void,
563 ): this;
564 on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & EventData) => void): this;
565 on(type: string, listener: (ev: any) => void): this;
566
567 once<T extends keyof MapLayerEventType>(
568 type: T,
569 layer: string | ReadonlyArray<string>,
570 listener: (ev: MapLayerEventType[T] & EventData) => void,
571 ): this;
572 once<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & EventData) => void): this;
573 once(type: string, listener: (ev: any) => void): this;
574 once<T extends keyof MapEventType>(type: T): Promise<MapEventType[T]>;
575
576 off<T extends keyof MapLayerEventType>(
577 type: T,
578 layer: string | ReadonlyArray<string>,
579 listener: (ev: MapLayerEventType[T] & EventData) => void,
580 ): this;
581 off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & EventData) => void): this;
582 off(type: string, listener: (ev: any) => void): this;
583
584 scrollZoom: ScrollZoomHandler;
585
586 boxZoom: BoxZoomHandler;
587
588 dragRotate: DragRotateHandler;
589
590 dragPan: DragPanHandler;
591
592 keyboard: KeyboardHandler;
593
594 doubleClickZoom: DoubleClickZoomHandler;
595
596 touchZoomRotate: TouchZoomRotateHandler;
597
598 touchPitch: TouchPitchHandler;
599
600 getFog(): Fog | null;
601 /**
602 * @param fog If `null` or `undefined` is provided, function removes fog from
603 * the map.
604 */
605 setFog(fog: Fog | null | undefined): this;
606
607 getProjection(): Projection;
608 setProjection(projection: Projection | string): this;
609 }
610
611 export interface MapboxOptions {
612 /**
613 * If true, the gl context will be created with MSA antialiasing, which can be useful for antialiasing custom layers.
614 * This is false by default as a performance optimization.
615 */
616 antialias?: boolean | undefined;
617
618 /** If true, an attribution control will be added to the map. */
619 attributionControl?: boolean | undefined;
620
621 bearing?: number | undefined;
622
623 /** Snap to north threshold in degrees. */
624 bearingSnap?: number | undefined;
625
626 /** The initial bounds of the map. If bounds is specified, it overrides center and zoom constructor options. */
627 bounds?: LngLatBoundsLike | undefined;
628
629 /** If true, enable the "box zoom" interaction (see BoxZoomHandler) */
630 boxZoom?: boolean | undefined;
631
632 /** initial map center */
633 center?: LngLatLike | undefined;
634
635 /**
636 * The max number of pixels a user can shift the mouse pointer during a click for it to be
637 * considered a valid click (as opposed to a mouse drag).
638 *
639 * @default 3
640 */
641 clickTolerance?: number | undefined;
642
643 /**
644 * If `true`, Resource Timing API information will be collected for requests made by GeoJSON
645 * and Vector Tile web workers (this information is normally inaccessible from the main
646 * Javascript thread). Information will be returned in a `resourceTiming` property of
647 * relevant `data` events.
648 *
649 * @default false
650 */
651 collectResourceTiming?: boolean | undefined;
652
653 /**
654 * If `true`, symbols from multiple sources can collide with each other during collision
655 * detection. If `false`, collision detection is run separately for the symbols in each source.
656 *
657 * @default true
658 */
659 crossSourceCollisions?: boolean | undefined;
660
661 /** ID of the container element */
662 container: string | HTMLElement;
663
664 /**
665 * If `true` , scroll zoom will require pressing the ctrl orkey while scrolling to zoom map,
666 * and touch pan will require using two fingers while panning to move the map.
667 * Touch pitch will require three fingers to activate if enabled.
668 */
669 cooperativeGestures?: boolean;
670
671 /** String or strings to show in an AttributionControl.
672 * Only applicable if options.attributionControl is `true`. */
673 customAttribution?: string | string[] | undefined;
674
675 /**
676 * If `true`, the "drag to pan" interaction is enabled.
677 * An `Object` value is passed as options to {@link DragPanHandler#enable}.
678 */
679 dragPan?: boolean | DragPanOptions | undefined;
680
681 /** If true, enable the "drag to rotate" interaction (see DragRotateHandler). */
682 dragRotate?: boolean | undefined;
683
684 /** If true, enable the "double click to zoom" interaction (see DoubleClickZoomHandler). */
685 doubleClickZoom?: boolean | undefined;
686
687 /** If `true`, the map's position (zoom, center latitude, center longitude, bearing, and pitch) will be synced with the hash fragment of the page's URL.
688 * For example, `http://path/to/my/page.html#2.59/39.26/53.07/-24.1/60`.
689 * An additional string may optionally be provided to indicate a parameter-styled hash,
690 * e.g. http://path/to/my/page.html#map=2.59/39.26/53.07/-24.1/60&foo=bar, where foo
691 * is a custom parameter and bar is an arbitrary hash distinct from the map hash.
692 * */
693 hash?: boolean | string | undefined;
694
695 /**
696 * Controls the duration of the fade-in/fade-out animation for label collisions, in milliseconds.
697 * This setting affects all symbol layers. This setting does not affect the duration of runtime
698 * styling transitions or raster tile cross-fading.
699 *
700 * @default 300
701 */
702 fadeDuration?: number | undefined;
703
704 /** If true, map creation will fail if the implementation determines that the performance of the created WebGL context would be dramatically lower than expected. */
705 failIfMajorPerformanceCaveat?: boolean | undefined;
706
707 /** A fitBounds options object to use only when setting the bounds option. */
708 fitBoundsOptions?: FitBoundsOptions | undefined;
709
710 /** If false, no mouse, touch, or keyboard listeners are attached to the map, so it will not respond to input */
711 interactive?: boolean | undefined;
712
713 /** If true, enable keyboard shortcuts (see KeyboardHandler). */
714 keyboard?: boolean | undefined;
715
716 /** A patch to apply to the default localization table for UI strings, e.g. control tooltips.
717 * The `locale` object maps namespaced UI string IDs to translated strings in the target language;
718 * see `src/ui/default_locale.js` for an example with all supported string IDs.
719 * The object may specify all UI strings (thereby adding support for a new translation) or
720 * only a subset of strings (thereby patching the default translation table).
721 */
722 locale?: { [key: string]: string } | undefined;
723
724 /**
725 * Overrides the generation of all glyphs and font settings except font-weight keywords
726 * Also overrides localIdeographFontFamily
727 * @default null
728 */
729 localFontFamily?: string | undefined;
730
731 /**
732 * If specified, defines a CSS font-family for locally overriding generation of glyphs in the
733 * 'CJK Unified Ideographs' and 'Hangul Syllables' ranges. In these ranges, font settings from
734 * the map's style will be ignored, except for font-weight keywords (light/regular/medium/bold).
735 * The purpose of this option is to avoid bandwidth-intensive glyph server requests.
736 *
737 * @default null
738 */
739 localIdeographFontFamily?: string | undefined;
740
741 /**
742 * A string representing the position of the Mapbox wordmark on the map.
743 *
744 * @default "bottom-left"
745 */
746 logoPosition?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | undefined;
747
748 /** If set, the map is constrained to the given bounds. */
749 maxBounds?: LngLatBoundsLike | undefined;
750
751 /** Maximum pitch of the map. */
752 maxPitch?: number | undefined;
753
754 /** Maximum zoom of the map. */
755 maxZoom?: number | undefined;
756
757 /** Minimum pitch of the map. */
758 minPitch?: number | undefined;
759
760 /** Minimum zoom of the map. */
761 minZoom?: number | undefined;
762
763 /**
764 * If true, map will prioritize rendering for performance by reordering layers
765 * If false, layers will always be drawn in the specified order
766 *
767 * @default true
768 */
769 optimizeForTerrain?: boolean | undefined;
770
771 /** If true, The maps canvas can be exported to a PNG using map.getCanvas().toDataURL();. This is false by default as a performance optimization. */
772 preserveDrawingBuffer?: boolean | undefined;
773
774 /**
775 * The initial pitch (tilt) of the map, measured in degrees away from the plane of the
776 * screen (0-60).
777 *
778 * @default 0
779 */
780 pitch?: number | undefined;
781
782 /**
783 * A style's projection property sets which projection a map is rendered in.
784 *
785 * @default 'mercator'
786 */
787 projection?: Projection;
788
789 /**
790 * If `false`, the map's pitch (tilt) control with "drag to rotate" interaction will be disabled.
791 *
792 * @default true
793 */
794 pitchWithRotate?: boolean | undefined;
795
796 /**
797 * If `false`, the map won't attempt to re-request tiles once they expire per their HTTP
798 * `cacheControl`/`expires` headers.
799 *
800 * @default true
801 */
802 refreshExpiredTiles?: boolean | undefined;
803
804 /**
805 * If `true`, multiple copies of the world will be rendered, when zoomed out.
806 *
807 * @default true
808 */
809 renderWorldCopies?: boolean | undefined;
810
811 /**
812 * If `true`, the "scroll to zoom" interaction is enabled.
813 * An `Object` value is passed as options to {@link ScrollZoomHandler#enable}.
814 */
815 scrollZoom?: boolean | InteractiveOptions | undefined;
816
817 /** stylesheet location */
818 style?: mapboxgl.Style | string | undefined;
819
820 /** If true, the map will automatically resize when the browser window resizes */
821 trackResize?: boolean | undefined;
822
823 /**
824 * A callback run before the Map makes a request for an external URL. The callback can be
825 * used to modify the url, set headers, or set the credentials property for cross-origin requests.
826 *
827 * @default null
828 */
829 transformRequest?: TransformRequestFunction | undefined;
830
831 /**
832 * If `true`, the "pinch to rotate and zoom" interaction is enabled.
833 * An `Object` value is passed as options to {@link TouchZoomRotateHandler#enable}.
834 */
835 touchZoomRotate?: boolean | InteractiveOptions | undefined;
836
837 /**
838 * If `true`, the "drag to pitch" interaction is enabled.
839 * An `Object` value is passed as options to {@link TouchPitchHandler#enable}.
840 */
841 touchPitch?: boolean | InteractiveOptions | undefined;
842
843 /** Initial zoom level */
844 zoom?: number | undefined;
845
846 /**
847 * The maximum number of tiles stored in the tile cache for a given source. If omitted, the
848 * cache will be dynamically sized based on the current viewport.
849 *
850 * @default null
851 */
852 maxTileCacheSize?: number | undefined;
853
854 /**
855 * If specified, map will use this token instead of the one defined in mapboxgl.accessToken.
856 *
857 * @default null
858 */
859 accessToken?: string | undefined;
860
861 /**
862 * Allows for the usage of the map in automated tests without an accessToken with custom self-hosted test fixtures.
863 *
864 * @default null
865 */
866 testMode?: boolean | undefined;
867 /**
868 * Sets the map's worldview. A worldview determines the way that certain disputed boundaries are rendered.
869 * By default, GL JS will not set a worldview so that the worldview of Mapbox tiles will be determined by
870 * the vector tile source's TileJSON. Valid worldview strings must be an ISO alpha-2 country code.
871 *
872 * @default null
873 */
874 worldview?: string | undefined;
875 }
876
877 type quat = number[];
878 type vec3 = number[];
879
880 /**
881 * Various options for accessing physical properties of the underlying camera entity.
882 * A direct access to these properties allows more flexible and precise controlling of the camera
883 * while also being fully compatible and interchangeable with CameraOptions. All fields are optional.
884 * See {@Link Camera#setFreeCameraOptions} and {@Link Camera#getFreeCameraOptions}
885 *
886 * @param {MercatorCoordinate} position Position of the camera in slightly modified web mercator coordinates
887 - The size of 1 unit is the width of the projected world instead of the "mercator meter".
888 Coordinate [0, 0, 0] is the north-west corner and [1, 1, 0] is the south-east corner.
889 - Z coordinate is conformal and must respect minimum and maximum zoom values.
890 - Zoom is automatically computed from the altitude (z)
891 * @param {quat} orientation Orientation of the camera represented as a unit quaternion [x, y, z, w]
892 in a left-handed coordinate space. Direction of the rotation is clockwise around the respective axis.
893 The default pose of the camera is such that the forward vector is looking up the -Z axis and
894 the up vector is aligned with north orientation of the map:
895 forward: [0, 0, -1]
896 up: [0, -1, 0]
897 right [1, 0, 0]
898 Orientation can be set freely but certain constraints still apply
899 - Orientation must be representable with only pitch and bearing.
900 - Pitch has an upper limit
901 */
902 export class FreeCameraOptions {
903 constructor(position?: MercatorCoordinate, orientation?: quat);
904
905 position: MercatorCoordinate | undefined;
906
907 /**
908 * Helper function for setting orientation of the camera by defining a focus point
909 * on the map.
910 *
911 * @param {LngLatLike} location Location of the focus point on the map
912 * @param {vec3} up Up vector of the camera is required in certain scenarios where bearing can't be deduced
913 * from the viewing direction.
914 */
915 lookAtPoint(location: LngLatLike, up?: vec3): void;
916
917 /**
918 * Helper function for setting the orientation of the camera as a pitch and a bearing.
919 *
920 * @param {number} pitch Pitch angle in degrees
921 * @param {number} bearing Bearing angle in degrees
922 */
923 setPitchBearing(pitch: number, bearing: number): void;
924 }
925
926 export type ResourceType =
927 | 'Unknown'
928 | 'Style'
929 | 'Source'
930 | 'Tile'
931 | 'Glyphs'
932 | 'SpriteImage'
933 | 'SpriteJSON'
934 | 'Image';
935
936 export interface RequestParameters {
937 /**
938 * The URL to be requested.
939 */
940 url: string;
941
942 /**
943 * Use `'include'` to send cookies with cross-origin requests.
944 */
945 credentials?: 'same-origin' | 'include' | undefined;
946
947 /**
948 * The headers to be sent with the request.
949 */
950 headers?: { [header: string]: any } | undefined;
951
952 method?: 'GET' | 'POST' | 'PUT' | undefined;
953
954 collectResourceTiming?: boolean | undefined;
955 }
956
957 export type TransformRequestFunction = (url: string, resourceType: ResourceType) => RequestParameters;
958
959 export interface PaddingOptions {
960 top: number;
961 bottom: number;
962 left: number;
963 right: number;
964 }
965
966 export interface FeatureIdentifier {
967 id?: string | number | undefined;
968 source: string;
969 sourceLayer?: string | undefined;
970 }
971
972 /**
973 * BoxZoomHandler
974 */
975 export class BoxZoomHandler {
976 constructor(map: mapboxgl.Map);
977
978 isEnabled(): boolean;
979
980 isActive(): boolean;
981
982 enable(): void;
983
984 disable(): void;
985 }
986
987 /**
988 * ScrollZoomHandler
989 */
990 export class ScrollZoomHandler {
991 constructor(map: mapboxgl.Map);
992
993 isEnabled(): boolean;
994
995 enable(options?: InteractiveOptions): void;
996
997 disable(): void;
998
999 setZoomRate(zoomRate: number): void;
1000
1001 setWheelZoomRate(wheelZoomRate: number): void;
1002 }
1003
1004 /**
1005 * DragPenHandler
1006 */
1007 export class DragPanHandler {
1008 constructor(map: mapboxgl.Map);
1009
1010 isEnabled(): boolean;
1011
1012 isActive(): boolean;
1013
1014 enable(options?: DragPanOptions): void;
1015
1016 disable(): void;
1017 }
1018
1019 /**
1020 * DragRotateHandler
1021 */
1022 export class DragRotateHandler {
1023 constructor(
1024 map: mapboxgl.Map,
1025 options?: { bearingSnap?: number | undefined; pitchWithRotate?: boolean | undefined },
1026 );
1027
1028 isEnabled(): boolean;
1029
1030 isActive(): boolean;
1031
1032 enable(): void;
1033
1034 disable(): void;
1035 }
1036
1037 /**
1038 * KeyboardHandler
1039 */
1040 export class KeyboardHandler {
1041 constructor(map: mapboxgl.Map);
1042
1043 isEnabled(): boolean;
1044
1045 enable(): void;
1046
1047 disable(): void;
1048
1049 /**
1050 * Returns true if the handler is enabled and has detected the start of a
1051 * zoom/rotate gesture.
1052 *
1053 * @returns {boolean} `true` if the handler is enabled and has detected the
1054 * start of a zoom/rotate gesture.
1055 */
1056 isActive(): boolean;
1057
1058 /**
1059 * Disables the "keyboard pan/rotate" interaction, leaving the
1060 * "keyboard zoom" interaction enabled.
1061 *
1062 * @example
1063 * map.keyboard.disableRotation();
1064 */
1065 disableRotation(): void;
1066
1067 /**
1068 * Enables the "keyboard pan/rotate" interaction.
1069 *
1070 * @example
1071 * map.keyboard.enable();
1072 * map.keyboard.enableRotation();
1073 */
1074 enableRotation(): void;
1075 }
1076
1077 /**
1078 * DoubleClickZoomHandler
1079 */
1080 export class DoubleClickZoomHandler {
1081 constructor(map: mapboxgl.Map);
1082
1083 isEnabled(): boolean;
1084
1085 enable(): void;
1086
1087 disable(): void;
1088 }
1089
1090 /**
1091 * TouchZoomRotateHandler
1092 */
1093 export class TouchZoomRotateHandler {
1094 constructor(map: mapboxgl.Map);
1095
1096 isEnabled(): boolean;
1097
1098 enable(options?: InteractiveOptions): void;
1099
1100 disable(): void;
1101
1102 disableRotation(): void;
1103
1104 enableRotation(): void;
1105 }
1106
1107 export class TouchPitchHandler {
1108 constructor(map: mapboxgl.Map);
1109
1110 enable(options?: InteractiveOptions): void;
1111
1112 isActive(): boolean;
1113
1114 isEnabled(): boolean;
1115
1116 disable(): void;
1117 }
1118
1119 export interface IControl {
1120 onAdd(map: Map): HTMLElement;
1121
1122 onRemove(map: Map): void;
1123
1124 getDefaultPosition?: (() => string) | undefined;
1125 }
1126
1127 /**
1128 * Control
1129 */
1130 export class Control extends Evented implements IControl {
1131 onAdd(map: Map): HTMLElement;
1132 onRemove(map: Map): void;
1133 getDefaultPosition?: (() => string) | undefined;
1134 }
1135
1136 /**
1137 * Navigation
1138 */
1139 export class NavigationControl extends Control {
1140 constructor(options?: {
1141 showCompass?: boolean | undefined;
1142 showZoom?: boolean | undefined;
1143 visualizePitch?: boolean | undefined;
1144 });
1145 }
1146
1147 export class PositionOptions {
1148 enableHighAccuracy?: boolean | undefined;
1149 timeout?: number | undefined;
1150 maximumAge?: number | undefined;
1151 }
1152
1153 /**
1154 * Geolocate
1155 */
1156 export class GeolocateControl extends Control {
1157 constructor(options?: {
1158 positionOptions?: PositionOptions | undefined;
1159 fitBoundsOptions?: FitBoundsOptions | undefined;
1160 trackUserLocation?: boolean | undefined;
1161 showAccuracyCircle?: boolean | undefined;
1162 showUserLocation?: boolean | undefined;
1163 showUserHeading?: boolean | undefined;
1164 geolocation?: Geolocation | undefined;
1165 });
1166 trigger(): boolean;
1167 }
1168
1169 /**
1170 * Attribution
1171 */
1172 export class AttributionControl extends Control {
1173 constructor(options?: { compact?: boolean | undefined; customAttribution?: string | string[] | undefined });
1174 }
1175
1176 /**
1177 * Scale
1178 */
1179 export class ScaleControl extends Control {
1180 constructor(options?: { maxWidth?: number | undefined; unit?: string | undefined });
1181
1182 setUnit(unit: 'imperial' | 'metric' | 'nautical'): void;
1183 }
1184
1185 /**
1186 * FullscreenControl
1187 */
1188 export class FullscreenControl extends Control {
1189 constructor(options?: FullscreenControlOptions | null);
1190 }
1191
1192 export interface FullscreenControlOptions {
1193 /**
1194 * A compatible DOM element which should be made full screen.
1195 * By default, the map container element will be made full screen.
1196 */
1197 container?: HTMLElement | null | undefined;
1198 }
1199
1200 /**
1201 * Popup
1202 */
1203 export class Popup extends Evented {
1204 constructor(options?: mapboxgl.PopupOptions);
1205
1206 addTo(map: mapboxgl.Map): this;
1207
1208 isOpen(): boolean;
1209
1210 remove(): this;
1211
1212 getLngLat(): mapboxgl.LngLat;
1213
1214 /**
1215 * Sets the geographical location of the popup's anchor, and moves the popup to it. Replaces trackPointer() behavior.
1216 *
1217 * @param lnglat The geographical location to set as the popup's anchor.
1218 */
1219 setLngLat(lnglat: LngLatLike): this;
1220
1221 /**
1222 * Tracks the popup anchor to the cursor position, on screens with a pointer device (will be hidden on touchscreens). Replaces the setLngLat behavior.
1223 * For most use cases, `closeOnClick` and `closeButton` should also be set to `false` here.
1224 */
1225 trackPointer(): this;
1226
1227 /** Returns the `Popup`'s HTML element. */
1228 getElement(): HTMLElement;
1229
1230 setText(text: string): this;
1231
1232 setHTML(html: string): this;
1233
1234 setDOMContent(htmlNode: Node): this;
1235
1236 getMaxWidth(): string;
1237
1238 setMaxWidth(maxWidth: string): this;
1239
1240 /**
1241 * Adds a CSS class to the popup container element.
1242 *
1243 * @param {string} className Non-empty string with CSS class name to add to popup container
1244 *
1245 * @example
1246 * let popup = new mapboxgl.Popup()
1247 * popup.addClassName('some-class')
1248 */
1249 addClassName(className: string): void;
1250
1251 /**
1252 * Removes a CSS class from the popup container element.
1253 *
1254 * @param {string} className Non-empty string with CSS class name to remove from popup container
1255 *
1256 * @example
1257 * let popup = new mapboxgl.Popup()
1258 * popup.removeClassName('some-class')
1259 */
1260 removeClassName(className: string): void;
1261
1262 /**
1263 * Sets the popup's offset.
1264 *
1265 * @param offset Sets the popup's offset.
1266 * @returns {Popup} `this`
1267 */
1268 setOffset(offset?: Offset | null): this;
1269
1270 /**
1271 * Add or remove the given CSS class on the popup container, depending on whether the container currently has that class.
1272 *
1273 * @param {string} className Non-empty string with CSS class name to add/remove
1274 *
1275 * @returns {boolean} if the class was removed return false, if class was added, then return true
1276 *
1277 * @example
1278 * let popup = new mapboxgl.Popup()
1279 * popup.toggleClassName('toggleClass')
1280 */
1281 toggleClassName(className: string): void;
1282 }
1283
1284 export interface PopupOptions {
1285 closeButton?: boolean | undefined;
1286
1287 closeOnClick?: boolean | undefined;
1288
1289 /**
1290 * @param {boolean} [options.closeOnMove=false] If `true`, the popup will closed when the map moves.
1291 */
1292 closeOnMove?: boolean | undefined;
1293
1294 /**
1295 * @param {boolean} [options.focusAfterOpen=true] If `true`, the popup will try to focus the
1296 * first focusable element inside the popup.
1297 */
1298 focusAfterOpen?: boolean | null | undefined;
1299
1300 anchor?: Anchor | undefined;
1301
1302 offset?: Offset | null | undefined;
1303
1304 className?: string | undefined;
1305
1306 maxWidth?: string | undefined;
1307 }
1308
1309 export interface Style {
1310 layers: AnyLayer[];
1311 sources: Sources;
1312
1313 bearing?: number | undefined;
1314 center?: number[] | undefined;
1315 fog?: Fog | undefined;
1316 glyphs?: string | undefined;
1317 metadata?: any;
1318 name?: string | undefined;
1319 pitch?: number | undefined;
1320 light?: Light | undefined;
1321 sprite?: string | undefined;
1322 terrain?: TerrainSpecification | undefined;
1323 transition?: Transition | undefined;
1324 version: number;
1325 zoom?: number | undefined;
1326 }
1327
1328 export interface Transition {
1329 delay?: number | undefined;
1330 duration?: number | undefined;
1331 }
1332
1333 export interface Light {
1334 anchor?: 'map' | 'viewport' | undefined;
1335 position?: number[] | undefined;
1336 'position-transition'?: Transition | undefined;
1337 color?: string | undefined;
1338 'color-transition'?: Transition | undefined;
1339 intensity?: number | undefined;
1340 'intensity-transition'?: Transition | undefined;
1341 }
1342
1343 export interface Fog {
1344 color?: string | Expression | undefined;
1345 'horizon-blend'?: number | Expression | undefined;
1346 range?: number[] | Expression | undefined;
1347 'high-color'?: string | Expression | undefined;
1348 'space-color'?: string | Expression | undefined;
1349 'star-intensity'?: number | Expression | undefined;
1350 }
1351
1352 export interface Sources {
1353 [sourceName: string]: AnySourceData;
1354 }
1355
1356 export type PromoteIdSpecification = { [key: string]: string } | string;
1357
1358 export type AnySourceData =
1359 | GeoJSONSourceRaw
1360 | VideoSourceRaw
1361 | ImageSourceRaw
1362 | CanvasSourceRaw
1363 | VectorSource
1364 | RasterSource
1365 | RasterDemSource
1366 | CustomSourceInterface<HTMLImageElement | ImageData | ImageBitmap>;
1367
1368 interface VectorSourceImpl extends VectorSource {
1369 /**
1370 * Sets the source `tiles` property and re-renders the map.
1371 *
1372 * @param {string[]} tiles An array of one or more tile source URLs, as in the TileJSON spec.
1373 * @returns {VectorTileSource} this
1374 */
1375 setTiles(tiles: ReadonlyArray<string>): VectorSourceImpl;
1376
1377 /**
1378 * Sets the source `url` property and re-renders the map.
1379 *
1380 * @param {string} url A URL to a TileJSON resource. Supported protocols are `http:`, `https:`, and `mapbox://<Tileset ID>`.
1381 * @returns {VectorTileSource} this
1382 */
1383 setUrl(url: string): VectorSourceImpl;
1384 }
1385
1386 export type AnySourceImpl =
1387 | GeoJSONSource
1388 | VideoSource
1389 | ImageSource
1390 | CanvasSource
1391 | VectorSourceImpl
1392 | RasterSource
1393 | RasterDemSource
1394 | CustomSource<HTMLImageElement | ImageData | ImageBitmap>;
1395
1396 export interface Source {
1397 type: 'vector' | 'raster' | 'raster-dem' | 'geojson' | 'image' | 'video' | 'canvas' | 'custom';
1398 }
1399
1400 /**
1401 * GeoJSONSource
1402 */
1403
1404 export interface GeoJSONSourceRaw extends Source, GeoJSONSourceOptions {
1405 type: 'geojson';
1406 }
1407
1408 export class GeoJSONSource implements GeoJSONSourceRaw {
1409 type: 'geojson';
1410
1411 constructor(options?: mapboxgl.GeoJSONSourceOptions);
1412
1413 setData(data: GeoJSON.Feature<GeoJSON.Geometry> | GeoJSON.FeatureCollection<GeoJSON.Geometry> | String): this;
1414
1415 getClusterExpansionZoom(clusterId: number, callback: (error: any, zoom: number) => void): this;
1416
1417 getClusterChildren(
1418 clusterId: number,
1419 callback: (error: any, features: GeoJSON.Feature<GeoJSON.Geometry>[]) => void,
1420 ): this;
1421
1422 getClusterLeaves(
1423 cluserId: number,
1424 limit: number,
1425 offset: number,
1426 callback: (error: any, features: GeoJSON.Feature<GeoJSON.Geometry>[]) => void,
1427 ): this;
1428 }
1429
1430 export interface GeoJSONSourceOptions {
1431 data?:
1432 | GeoJSON.Feature<GeoJSON.Geometry>
1433 | GeoJSON.FeatureCollection<GeoJSON.Geometry>
1434 | GeoJSON.Geometry
1435 | string
1436 | undefined;
1437
1438 maxzoom?: number | undefined;
1439
1440 attribution?: string | undefined;
1441
1442 buffer?: number | undefined;
1443
1444 tolerance?: number | undefined;
1445
1446 cluster?: number | boolean | undefined;
1447
1448 clusterRadius?: number | undefined;
1449
1450 clusterMaxZoom?: number | undefined;
1451
1452 /**
1453 * Minimum number of points necessary to form a cluster if clustering is enabled. Defaults to `2`.
1454 */
1455 clusterMinPoints?: number | undefined;
1456
1457 clusterProperties?: object | undefined;
1458
1459 lineMetrics?: boolean | undefined;
1460
1461 generateId?: boolean | undefined;
1462
1463 promoteId?: PromoteIdSpecification | undefined;
1464
1465 filter?: any;
1466 }
1467
1468 /**
1469 * VideoSource
1470 */
1471 export interface VideoSourceRaw extends Source, VideoSourceOptions {
1472 type: 'video';
1473 }
1474
1475 export class VideoSource implements VideoSourceRaw {
1476 type: 'video';
1477
1478 constructor(options?: mapboxgl.VideoSourceOptions);
1479
1480 getVideo(): HTMLVideoElement;
1481
1482 setCoordinates(coordinates: number[][]): this;
1483 }
1484
1485 export interface VideoSourceOptions {
1486 urls?: string[] | undefined;
1487
1488 coordinates?: number[][] | undefined;
1489 }
1490
1491 /**
1492 * ImageSource
1493 */
1494 export interface ImageSourceRaw extends Source, ImageSourceOptions {
1495 type: 'image';
1496 }
1497
1498 export class ImageSource implements ImageSourceRaw {
1499 type: 'image';
1500
1501 constructor(options?: mapboxgl.ImageSourceOptions);
1502
1503 updateImage(options: ImageSourceOptions): this;
1504
1505 setCoordinates(coordinates: number[][]): this;
1506 }
1507
1508 export interface ImageSourceOptions {
1509 url?: string | undefined;
1510
1511 coordinates?: number[][] | undefined;
1512 }
1513
1514 /**
1515 * CanvasSource
1516 */
1517 export interface CanvasSourceRaw extends Source, CanvasSourceOptions {
1518 type: 'canvas';
1519 }
1520
1521 export class CanvasSource implements CanvasSourceRaw {
1522 type: 'canvas';
1523
1524 coordinates: number[][];
1525
1526 canvas: string | HTMLCanvasElement;
1527
1528 play(): void;
1529
1530 pause(): void;
1531
1532 getCanvas(): HTMLCanvasElement;
1533
1534 setCoordinates(coordinates: number[][]): this;
1535 }
1536
1537 export interface CanvasSourceOptions {
1538 coordinates: number[][];
1539
1540 animate?: boolean | undefined;
1541
1542 canvas: string | HTMLCanvasElement;
1543 }
1544
1545 export type CameraFunctionSpecification<T> =
1546 | { type: 'exponential'; stops: Array<[number, T]> }
1547 | { type: 'interval'; stops: Array<[number, T]> };
1548
1549 export type ExpressionSpecification = Array<unknown>;
1550
1551 export type PropertyValueSpecification<T> = T | CameraFunctionSpecification<T> | ExpressionSpecification;
1552
1553 export interface TerrainSpecification {
1554 source: string;
1555 exaggeration?: PropertyValueSpecification<number> | undefined;
1556 }
1557
1558 /**
1559 * @see https://github.com/mapbox/tilejson-spec/tree/master/3.0.0#33-vector_layers
1560 */
1561 type SourceVectorLayer = {
1562 id: string;
1563 fields?: Record<string, string>;
1564 description?: string;
1565 minzoom?: number;
1566 maxzoom?: number;
1567
1568 // Non standard extensions that are valid in a Mapbox context.
1569 source?: string;
1570 source_name?: string;
1571 };
1572
1573 interface VectorSource extends Source {
1574 type: 'vector';
1575 format?: 'pbf';
1576
1577 url?: string | undefined;
1578 id?: string;
1579 name?: string;
1580
1581 tiles?: string[] | undefined;
1582 bounds?: number[] | undefined;
1583 scheme?: 'xyz' | 'tms' | undefined;
1584 minzoom?: number | undefined;
1585 maxzoom?: number | undefined;
1586 attribution?: string | undefined;
1587 promoteId?: PromoteIdSpecification | undefined;
1588
1589 vector_layers?: SourceVectorLayer[];
1590 }
1591
1592 interface RasterSource extends Source {
1593 name?: string;
1594 type: 'raster';
1595 id?: string;
1596 format?: 'webp' | string;
1597
1598 url?: string | undefined;
1599 tiles?: string[] | undefined;
1600 bounds?: number[] | undefined;
1601 minzoom?: number | undefined;
1602 maxzoom?: number | undefined;
1603 tileSize?: number | undefined;
1604 scheme?: 'xyz' | 'tms' | undefined;
1605 attribution?: string | undefined;
1606 }
1607
1608 interface RasterDemSource extends Source {
1609 name?: string;
1610 type: 'raster-dem';
1611 id?: string;
1612
1613 url?: string | undefined;
1614 tiles?: string[] | undefined;
1615 bounds?: number[] | undefined;
1616 minzoom?: number | undefined;
1617 maxzoom?: number | undefined;
1618 tileSize?: number | undefined;
1619 attribution?: string | undefined;
1620 encoding?: 'terrarium' | 'mapbox' | undefined;
1621 }
1622
1623 interface CustomSourceInterface<T> {
1624 id: string;
1625 type: 'custom';
1626 dataType: 'raster';
1627 minzoom?: number;
1628 maxzoom?: number;
1629 scheme?: string;
1630 tileSize?: number;
1631 attribution?: string;
1632 bounds?: [number, number, number, number];
1633 hasTile?: (tileID: { z: number; x: number; y: number }) => boolean;
1634 loadTile: (tileID: { z: number; x: number; y: number }, options: { signal: AbortSignal }) => Promise<T>;
1635 prepareTile?: (tileID: { z: number; x: number; y: number }) => T | undefined;
1636 unloadTile?: (tileID: { z: number; x: number; y: number }) => void;
1637 onAdd?: (map: Map) => void;
1638 onRemove?: (map: Map) => void;
1639 }
1640
1641 interface CustomSource<T> extends Source {
1642 id: string;
1643 type: 'custom';
1644 scheme: string;
1645 minzoom: number;
1646 maxzoom: number;
1647 tileSize: number;
1648 attribution: string;
1649
1650 _implementation: CustomSourceInterface<T>;
1651 }
1652
1653 /**
1654 * LngLat
1655 */
1656 export class LngLat {
1657 lng: number;
1658 lat: number;
1659
1660 constructor(lng: number, lat: number);
1661
1662 /** Return a new LngLat object whose longitude is wrapped to the range (-180, 180). */
1663 wrap(): mapboxgl.LngLat;
1664
1665 /** Return a LngLat as an array */
1666 toArray(): number[];
1667
1668 /** Return a LngLat as a string */
1669 toString(): string;
1670
1671 /** Returns the approximate distance between a pair of coordinates in meters
1672 * Uses the Haversine Formula (from R.W. Sinnott, "Virtues of the Haversine", Sky and Telescope, vol. 68, no. 2, 1984, p. 159) */
1673 distanceTo(lngLat: LngLat): number;
1674
1675 toBounds(radius: number): LngLatBounds;
1676
1677 static convert(input: LngLatLike): mapboxgl.LngLat;
1678 }
1679
1680 /**
1681 * LngLatBounds
1682 */
1683 export class LngLatBounds {
1684 sw: LngLatLike;
1685 ne: LngLatLike;
1686 _sw: LngLat;
1687 _ne: LngLat;
1688
1689 constructor(boundsLike?: [LngLatLike, LngLatLike] | [number, number, number, number]);
1690 constructor(sw: LngLatLike, ne: LngLatLike);
1691
1692 setNorthEast(ne: LngLatLike): this;
1693
1694 setSouthWest(sw: LngLatLike): this;
1695
1696 /** Check if the point is within the bounding box. */
1697 contains(lnglat: LngLatLike): boolean;
1698
1699 /** Extend the bounds to include a given LngLat or LngLatBounds. */
1700 extend(obj: mapboxgl.LngLatLike | mapboxgl.LngLatBoundsLike): this;
1701
1702 /** Get the point equidistant from this box's corners */
1703 getCenter(): mapboxgl.LngLat;
1704
1705 /** Get southwest corner */
1706 getSouthWest(): mapboxgl.LngLat;
1707
1708 /** Get northeast corner */
1709 getNorthEast(): mapboxgl.LngLat;
1710
1711 /** Get northwest corner */
1712 getNorthWest(): mapboxgl.LngLat;
1713
1714 /** Get southeast corner */
1715 getSouthEast(): mapboxgl.LngLat;
1716
1717 /** Get west edge longitude */
1718 getWest(): number;
1719
1720 /** Get south edge latitude */
1721 getSouth(): number;
1722
1723 /** Get east edge longitude */
1724 getEast(): number;
1725
1726 /** Get north edge latitude */
1727 getNorth(): number;
1728
1729 /** Returns a LngLatBounds as an array */
1730 toArray(): number[][];
1731
1732 /** Return a LngLatBounds as a string */
1733 toString(): string;
1734
1735 /** Returns a boolean */
1736 isEmpty(): boolean;
1737
1738 /** Convert an array to a LngLatBounds object, or return an existing LngLatBounds object unchanged. */
1739 static convert(input: LngLatBoundsLike): mapboxgl.LngLatBounds;
1740 }
1741
1742 /**
1743 * Point
1744 */
1745 // Todo: Pull out class to seperate definition for Module "point-geometry"
1746 export class Point {
1747 x: number;
1748 y: number;
1749
1750 constructor(x: number, y: number);
1751
1752 clone(): Point;
1753
1754 add(p: Point): Point;
1755
1756 sub(p: Point): Point;
1757
1758 mult(k: number): Point;
1759
1760 div(k: number): Point;
1761
1762 rotate(a: number): Point;
1763
1764 matMult(m: number): Point;
1765
1766 unit(): Point;
1767
1768 perp(): Point;
1769
1770 round(): Point;
1771
1772 mag(): number;
1773
1774 equals(p: Point): boolean;
1775
1776 dist(p: Point): number;
1777
1778 distSqr(p: Point): number;
1779
1780 angle(): number;
1781
1782 angleTo(p: Point): number;
1783
1784 angleWidth(p: Point): number;
1785
1786 angleWithSep(x: number, y: number): number;
1787
1788 static convert(a: PointLike): Point;
1789 }
1790
1791 /**
1792 * MercatorCoordinate
1793 */
1794 export class MercatorCoordinate {
1795 /** The x component of the position. */
1796 x: number;
1797
1798 /** The y component of the position. */
1799 y: number;
1800
1801 /**
1802 * The z component of the position.
1803 *
1804 * @default 0
1805 */
1806 z?: number | undefined;
1807
1808 constructor(x: number, y: number, z?: number);
1809
1810 /** Returns the altitude in meters of the coordinate. */
1811 toAltitude(): number;
1812
1813 /** Returns the LngLat for the coordinate. */
1814 toLngLat(): LngLat;
1815
1816 /**
1817 * Returns the distance of 1 meter in MercatorCoordinate units at this latitude.
1818 *
1819 * For coordinates in real world units using meters, this naturally provides the
1820 * scale to transform into MercatorCoordinates.
1821 */
1822 meterInMercatorCoordinateUnits(): number;
1823
1824 /** Project a LngLat to a MercatorCoordinate. */
1825 static fromLngLat(lngLatLike: LngLatLike, altitude?: number): MercatorCoordinate;
1826 }
1827
1828 /**
1829 * Marker
1830 */
1831 export class Marker extends Evented {
1832 constructor(options?: mapboxgl.MarkerOptions);
1833
1834 constructor(element?: HTMLElement, options?: mapboxgl.MarkerOptions);
1835
1836 addTo(map: Map): this;
1837
1838 remove(): this;
1839
1840 getLngLat(): LngLat;
1841
1842 setLngLat(lngLat: LngLatLike): this;
1843
1844 getElement(): HTMLElement;
1845
1846 setPopup(popup?: Popup): this;
1847
1848 getPopup(): Popup;
1849
1850 togglePopup(): this;
1851
1852 getOffset(): PointLike;
1853
1854 setOffset(offset: PointLike): this;
1855
1856 setDraggable(shouldBeDraggable: boolean): this;
1857
1858 isDraggable(): boolean;
1859
1860 getRotation(): number;
1861
1862 setRotation(rotation: number): this;
1863
1864 getRotationAlignment(): Alignment;
1865
1866 setRotationAlignment(alignment: Alignment): this;
1867
1868 getPitchAlignment(): Alignment;
1869
1870 setPitchAlignment(alignment: Alignment): this;
1871
1872 getOccludedOpacity(): number;
1873
1874 setOccludedOpacity(opacity: number): this;
1875 }
1876
1877 type Alignment = 'map' | 'viewport' | 'auto';
1878
1879 export interface MarkerOptions {
1880 /** DOM element to use as a marker. The default is a light blue, droplet-shaped SVG marker */
1881 element?: HTMLElement | undefined;
1882
1883 /** The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up. */
1884 offset?: PointLike | undefined;
1885
1886 /** A string indicating the part of the Marker that should be positioned closest to the coordinate set via Marker.setLngLat.
1887 * Options are `'center'`, `'top'`, `'bottom'`, `'left'`, `'right'`, `'top-left'`, `'top-right'`, `'bottom-left'`, and `'bottom-right'`.
1888 * The default value os `'center'`
1889 */
1890 anchor?: Anchor | undefined;
1891
1892 /** The color to use for the default marker if options.element is not provided. The default is light blue (#3FB1CE). */
1893 color?: string | undefined;
1894
1895 /** A boolean indicating whether or not a marker is able to be dragged to a new position on the map. The default value is false */
1896 draggable?: boolean | undefined;
1897
1898 /**
1899 * The max number of pixels a user can shift the mouse pointer during a click on the marker for it to be considered a valid click
1900 * (as opposed to a marker drag). The default (0) is to inherit map's clickTolerance.
1901 */
1902 clickTolerance?: number | null | undefined;
1903
1904 /** The rotation angle of the marker in degrees, relative to its `rotationAlignment` setting. A positive value will rotate the marker clockwise.
1905 * The default value is 0.
1906 */
1907 rotation?: number | undefined;
1908
1909 /** `map` aligns the `Marker`'s rotation relative to the map, maintaining a bearing as the map rotates.
1910 * `viewport` aligns the `Marker`'s rotation relative to the viewport, agnostic to map rotations.
1911 * `auto` is equivalent to `viewport`.
1912 * The default value is `auto`
1913 */
1914 rotationAlignment?: Alignment | undefined;
1915
1916 /** `map` aligns the `Marker` to the plane of the map.
1917 * `viewport` aligns the `Marker` to the plane of the viewport.
1918 * `auto` automatically matches the value of `rotationAlignment`.
1919 * The default value is `auto`.
1920 */
1921 pitchAlignment?: Alignment | undefined;
1922
1923 /** The scale to use for the default marker if options.element is not provided.
1924 * The default scale (1) corresponds to a height of `41px` and a width of `27px`.
1925 */
1926 scale?: number | undefined;
1927
1928 /**
1929 * The opacity of a marker that's occluded by 3D terrain. Number between 0 and 1.
1930 */
1931 occludedOpacity?: number | undefined;
1932 }
1933
1934 type EventedListener = (object?: Object) => any;
1935 /**
1936 * Evented
1937 */
1938 export class Evented {
1939 on(type: string, listener: EventedListener): this;
1940
1941 off(type?: string | any, listener?: EventedListener): this;
1942
1943 once(type: string, listener: EventedListener): this;
1944
1945 // https://github.com/mapbox/mapbox-gl-js/issues/6522
1946 fire(type: string, properties?: { [key: string]: any }): this;
1947 }
1948
1949 /**
1950 * StyleOptions
1951 */
1952 export interface StyleOptions {
1953 transition?: boolean | undefined;
1954 }
1955
1956 export type MapboxGeoJSONFeature = GeoJSON.Feature<GeoJSON.Geometry> & {
1957 layer: Layer;
1958 source: string;
1959 sourceLayer: string;
1960 state: { [key: string]: any };
1961 };
1962
1963 export type EventData = { [key: string]: any };
1964
1965 export class MapboxEvent<TOrig = undefined> {
1966 type: string;
1967 target: Map;
1968 originalEvent: TOrig;
1969 }
1970
1971 export class MapMouseEvent extends MapboxEvent<MouseEvent> {
1972 type:
1973 | 'mousedown'
1974 | 'mouseup'
1975 | 'click'
1976 | 'dblclick'
1977 | 'mousemove'
1978 | 'mouseover'
1979 | 'mouseenter'
1980 | 'mouseleave'
1981 | 'mouseout'
1982 | 'contextmenu';
1983
1984 point: Point;
1985 lngLat: LngLat;
1986
1987 preventDefault(): void;
1988 defaultPrevented: boolean;
1989 }
1990
1991 export type MapLayerMouseEvent = MapMouseEvent & { features?: MapboxGeoJSONFeature[] | undefined };
1992
1993 export class MapTouchEvent extends MapboxEvent<TouchEvent> {
1994 type: 'touchstart' | 'touchend' | 'touchcancel';
1995
1996 point: Point;
1997 lngLat: LngLat;
1998 points: Point[];
1999 lngLats: LngLat[];
2000
2001 preventDefault(): void;
2002 defaultPrevented: boolean;
2003 }
2004
2005 export type MapLayerTouchEvent = MapTouchEvent & { features?: MapboxGeoJSONFeature[] | undefined };
2006
2007 export class MapWheelEvent extends MapboxEvent<WheelEvent> {
2008 type: 'wheel';
2009
2010 preventDefault(): void;
2011 defaultPrevented: boolean;
2012 }
2013
2014 export interface MapBoxZoomEvent extends MapboxEvent<MouseEvent> {
2015 type: 'boxzoomstart' | 'boxzoomend' | 'boxzoomcancel';
2016
2017 boxZoomBounds: LngLatBounds;
2018 }
2019
2020 export type MapDataEvent = MapSourceDataEvent | MapStyleDataEvent;
2021
2022 export interface MapStyleDataEvent extends MapboxEvent {
2023 dataType: 'style';
2024 }
2025
2026 export interface MapSourceDataEvent extends MapboxEvent {
2027 dataType: 'source';
2028 isSourceLoaded: boolean;
2029 source: Source;
2030 sourceId: string;
2031 sourceDataType: 'metadata' | 'content';
2032 tile: any;
2033 coord: Coordinate;
2034 }
2035
2036 export interface Coordinate {
2037 canonical: CanonicalCoordinate;
2038 wrap: number;
2039 key: number;
2040 }
2041
2042 export interface CanonicalCoordinate {
2043 x: number;
2044 y: number;
2045 z: number;
2046 key: number;
2047 equals(coord: CanonicalCoordinate): boolean;
2048 }
2049
2050 export interface MapContextEvent extends MapboxEvent<WebGLContextEvent> {
2051 type: 'webglcontextlost' | 'webglcontextrestored';
2052 }
2053
2054 export class ErrorEvent extends MapboxEvent {
2055 type: 'error';
2056 error: Error;
2057 }
2058
2059 /**
2060 * FilterOptions
2061 */
2062 export interface FilterOptions {
2063 /**
2064 * Whether to check if the filter conforms to the Mapbox GL Style Specification.
2065 * Disabling validation is a performance optimization that should only be used
2066 * if you have previously validated the values you will be passing to this function.
2067 */
2068 validate?: boolean | null | undefined;
2069 }
2070
2071 /**
2072 * AnimationOptions
2073 */
2074 export interface AnimationOptions {
2075 /** Number in milliseconds */
2076 duration?: number | undefined;
2077 /**
2078 * A function taking a time in the range 0..1 and returning a number where 0 is the initial
2079 * state and 1 is the final state.
2080 */
2081 easing?: ((time: number) => number) | undefined;
2082 /** point, origin of movement relative to map center */
2083 offset?: PointLike | undefined;
2084 /** When set to false, no animation happens */
2085 animate?: boolean | undefined;
2086
2087 /** If `true`, then the animation is considered essential and will not be affected by `prefers-reduced-motion`.
2088 * Otherwise, the transition will happen instantly if the user has enabled the `reduced motion` accesibility feature in their operating system.
2089 */
2090 essential?: boolean | undefined;
2091 }
2092
2093 /**
2094 * CameraOptions
2095 */
2096 export interface CameraOptions {
2097 /** Map center */
2098 center?: LngLatLike | undefined;
2099 /** Map zoom level */
2100 zoom?: number | undefined;
2101 /** Map rotation bearing in degrees counter-clockwise from north */
2102 bearing?: number | undefined;
2103 /** Map angle in degrees at which the camera is looking at the ground */
2104 pitch?: number | undefined;
2105 /** If zooming, the zoom center (defaults to map center) */
2106 around?: LngLatLike | undefined;
2107 /** Dimensions in pixels applied on each side of the viewport for shifting the vanishing point. */
2108 padding?: number | PaddingOptions | undefined;
2109 }
2110
2111 export interface CameraForBoundsOptions extends CameraOptions {
2112 offset?: PointLike | undefined;
2113 maxZoom?: number | undefined;
2114 }
2115
2116 // The Mapbox docs say that if the result is defined, it will have zoom, center and bearing set.
2117 // In practice center is always a {lat, lng} object.
2118 export type CameraForBoundsResult = Required<Pick<CameraOptions, 'zoom' | 'bearing'>> & {
2119 /** Map center */
2120 center: { lng: number; lat: number };
2121 };
2122
2123 /**
2124 * FlyToOptions
2125 */
2126 export interface FlyToOptions extends AnimationOptions, CameraOptions {
2127 curve?: number | undefined;
2128 minZoom?: number | undefined;
2129 speed?: number | undefined;
2130 screenSpeed?: number | undefined;
2131 maxDuration?: number | undefined;
2132 }
2133
2134 /**
2135 * EaseToOptions
2136 */
2137 export interface EaseToOptions extends AnimationOptions, CameraOptions {
2138 delayEndEvents?: number | undefined;
2139 }
2140
2141 export interface FitBoundsOptions extends mapboxgl.FlyToOptions {
2142 linear?: boolean | undefined;
2143 offset?: mapboxgl.PointLike | undefined;
2144 maxZoom?: number | undefined;
2145 maxDuration?: number | undefined;
2146 }
2147
2148 /**
2149 * MapEvent
2150 */
2151 export type MapEventType = {
2152 error: ErrorEvent;
2153
2154 load: MapboxEvent;
2155 idle: MapboxEvent;
2156 remove: MapboxEvent;
2157 render: MapboxEvent;
2158 resize: MapboxEvent;
2159
2160 webglcontextlost: MapContextEvent;
2161 webglcontextrestored: MapContextEvent;
2162
2163 dataloading: MapDataEvent;
2164 data: MapDataEvent;
2165 tiledataloading: MapDataEvent;
2166 sourcedataloading: MapSourceDataEvent;
2167 styledataloading: MapStyleDataEvent;
2168 sourcedata: MapSourceDataEvent;
2169 styledata: MapStyleDataEvent;
2170
2171 boxzoomcancel: MapBoxZoomEvent;
2172 boxzoomstart: MapBoxZoomEvent;
2173 boxzoomend: MapBoxZoomEvent;
2174
2175 touchcancel: MapTouchEvent;
2176 touchmove: MapTouchEvent;
2177 touchend: MapTouchEvent;
2178 touchstart: MapTouchEvent;
2179
2180 click: MapMouseEvent;
2181 contextmenu: MapMouseEvent;
2182 dblclick: MapMouseEvent;
2183 mousemove: MapMouseEvent;
2184 mouseup: MapMouseEvent;
2185 mousedown: MapMouseEvent;
2186 mouseout: MapMouseEvent;
2187 mouseover: MapMouseEvent;
2188
2189 movestart: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2190 move: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2191 moveend: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2192
2193 zoomstart: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2194 zoom: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2195 zoomend: MapboxEvent<MouseEvent | TouchEvent | WheelEvent | undefined>;
2196
2197 rotatestart: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2198 rotate: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2199 rotateend: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2200
2201 dragstart: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2202 drag: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2203 dragend: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2204
2205 pitchstart: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2206 pitch: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2207 pitchend: MapboxEvent<MouseEvent | TouchEvent | undefined>;
2208
2209 wheel: MapWheelEvent;
2210 };
2211
2212 export type MapLayerEventType = {
2213 click: MapLayerMouseEvent;
2214 dblclick: MapLayerMouseEvent;
2215 mousedown: MapLayerMouseEvent;
2216 mouseup: MapLayerMouseEvent;
2217 mousemove: MapLayerMouseEvent;
2218 mouseenter: MapLayerMouseEvent;
2219 mouseleave: MapLayerMouseEvent;
2220 mouseover: MapLayerMouseEvent;
2221 mouseout: MapLayerMouseEvent;
2222 contextmenu: MapLayerMouseEvent;
2223
2224 touchstart: MapLayerTouchEvent;
2225 touchend: MapLayerTouchEvent;
2226 touchcancel: MapLayerTouchEvent;
2227 };
2228
2229 export type AnyLayout =
2230 | BackgroundLayout
2231 | FillLayout
2232 | FillExtrusionLayout
2233 | LineLayout
2234 | SymbolLayout
2235 | RasterLayout
2236 | CircleLayout
2237 | HeatmapLayout
2238 | HillshadeLayout
2239 | SkyLayout;
2240
2241 export type AnyPaint =
2242 | BackgroundPaint
2243 | FillPaint
2244 | FillExtrusionPaint
2245 | LinePaint
2246 | SymbolPaint
2247 | RasterPaint
2248 | CirclePaint
2249 | HeatmapPaint
2250 | HillshadePaint
2251 | SkyPaint;
2252
2253 interface Layer {
2254 id: string;
2255 type: string;
2256
2257 metadata?: any;
2258 ref?: string | undefined;
2259
2260 source?: string | AnySourceData | undefined;
2261
2262 'source-layer'?: string | undefined;
2263
2264 minzoom?: number | undefined;
2265 maxzoom?: number | undefined;
2266
2267 interactive?: boolean | undefined;
2268
2269 filter?: any[] | undefined;
2270 layout?: AnyLayout | undefined;
2271 paint?: AnyPaint | undefined;
2272 }
2273
2274 interface BackgroundLayer extends Layer {
2275 type: 'background';
2276 layout?: BackgroundLayout | undefined;
2277 paint?: BackgroundPaint | undefined;
2278 }
2279
2280 interface CircleLayer extends Layer {
2281 type: 'circle';
2282 layout?: CircleLayout | undefined;
2283 paint?: CirclePaint | undefined;
2284 }
2285
2286 interface FillExtrusionLayer extends Layer {
2287 type: 'fill-extrusion';
2288 layout?: FillExtrusionLayout | undefined;
2289 paint?: FillExtrusionPaint | undefined;
2290 }
2291
2292 interface FillLayer extends Layer {
2293 type: 'fill';
2294 layout?: FillLayout | undefined;
2295 paint?: FillPaint | undefined;
2296 }
2297
2298 interface HeatmapLayer extends Layer {
2299 type: 'heatmap';
2300 layout?: HeatmapLayout | undefined;
2301 paint?: HeatmapPaint | undefined;
2302 }
2303
2304 interface HillshadeLayer extends Layer {
2305 type: 'hillshade';
2306 layout?: HillshadeLayout | undefined;
2307 paint?: HillshadePaint | undefined;
2308 }
2309
2310 interface LineLayer extends Layer {
2311 type: 'line';
2312 layout?: LineLayout | undefined;
2313 paint?: LinePaint | undefined;
2314 }
2315
2316 interface RasterLayer extends Layer {
2317 type: 'raster';
2318 layout?: RasterLayout | undefined;
2319 paint?: RasterPaint | undefined;
2320 }
2321
2322 interface SymbolLayer extends Layer {
2323 type: 'symbol';
2324 layout?: SymbolLayout | undefined;
2325 paint?: SymbolPaint | undefined;
2326 }
2327
2328 interface SkyLayer extends Layer {
2329 type: 'sky';
2330 layout?: SkyLayout | undefined;
2331 paint?: SkyPaint | undefined;
2332 }
2333
2334 export type AnyLayer =
2335 | BackgroundLayer
2336 | CircleLayer
2337 | FillExtrusionLayer
2338 | FillLayer
2339 | HeatmapLayer
2340 | HillshadeLayer
2341 | LineLayer
2342 | RasterLayer
2343 | SymbolLayer
2344 | CustomLayerInterface
2345 | SkyLayer;
2346
2347 // See https://docs.mapbox.com/mapbox-gl-js/api/#customlayerinterface
2348 export interface CustomLayerInterface {
2349 /** A unique layer id. */
2350 id: string;
2351
2352 /* The layer's type. Must be "custom". */
2353 type: 'custom';
2354
2355 /* Either "2d" or "3d". Defaults to "2d". */
2356 renderingMode?: '2d' | '3d' | undefined;
2357
2358 /**
2359 * Optional method called when the layer has been removed from the Map with Map#removeLayer.
2360 * This gives the layer a chance to clean up gl resources and event listeners.
2361 * @param map The Map this custom layer was just added to.
2362 * @param gl The gl context for the map.
2363 */
2364 onRemove?(map: mapboxgl.Map, gl: WebGLRenderingContext): void;
2365
2366 /**
2367 * Optional method called when the layer has been added to the Map with Map#addLayer.
2368 * This gives the layer a chance to initialize gl resources and register event listeners.
2369 * @param map The Map this custom layer was just added to.
2370 * @param gl The gl context for the map.
2371 */
2372 onAdd?(map: mapboxgl.Map, gl: WebGLRenderingContext): void;
2373
2374 /**
2375 * Optional method called during a render frame to allow a layer to prepare resources
2376 * or render into a texture.
2377 *
2378 * The layer cannot make any assumptions about the current GL state and must bind a framebuffer
2379 * before rendering.
2380 * @param gl The map's gl context.
2381 * @param matrix The map's camera matrix. It projects spherical mercator coordinates to gl
2382 * coordinates. The mercator coordinate [0, 0] represents the top left corner of
2383 * the mercator world and [1, 1] represents the bottom right corner. When the
2384 * renderingMode is "3d" , the z coordinate is conformal. A box with identical
2385 * x, y, and z lengths in mercator units would be rendered as a cube.
2386 * MercatorCoordinate .fromLatLng can be used to project a LngLat to a mercator
2387 * coordinate.
2388 */
2389 prerender?(gl: WebGLRenderingContext, matrix: number[]): void;
2390
2391 /**
2392 * Called during a render frame allowing the layer to draw into the GL context.
2393 *
2394 * The layer can assume blending and depth state is set to allow the layer to properly blend
2395 * and clip other layers. The layer cannot make any other assumptions about the current GL state.
2396 *
2397 * If the layer needs to render to a texture, it should implement the prerender method to do this
2398 * and only use the render method for drawing directly into the main framebuffer.
2399 *
2400 * The blend function is set to gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA). This expects
2401 * colors to be provided in premultiplied alpha form where the r, g and b values are already
2402 * multiplied by the a value. If you are unable to provide colors in premultiplied form you may
2403 * want to change the blend function to
2404 * gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA).
2405 *
2406 * @param gl The map's gl context.
2407 * @param matrix The map's camera matrix. It projects spherical mercator coordinates to gl
2408 * coordinates. The mercator coordinate [0, 0] represents the top left corner of
2409 * the mercator world and [1, 1] represents the bottom right corner. When the
2410 * renderingMode is "3d" , the z coordinate is conformal. A box with identical
2411 * x, y, and z lengths in mercator units would be rendered as a cube.
2412 * MercatorCoordinate .fromLatLng can be used to project a LngLat to a mercator
2413 * coordinate.
2414 */
2415 render(gl: WebGLRenderingContext, matrix: number[]): void;
2416 }
2417
2418 export interface StyleFunction {
2419 stops?: any[][] | undefined;
2420 property?: string | undefined;
2421 base?: number | undefined;
2422 type?: 'identity' | 'exponential' | 'interval' | 'categorical' | undefined;
2423 default?: any;
2424 colorSpace?: 'rgb' | 'lab' | 'hcl' | undefined;
2425 }
2426
2427 type Visibility = 'visible' | 'none';
2428
2429 export interface Layout {
2430 visibility?: Visibility | undefined;
2431 }
2432
2433 export interface BackgroundLayout extends Layout {}
2434
2435 export interface BackgroundPaint {
2436 'background-color'?: string | Expression | undefined;
2437 'background-color-transition'?: Transition | undefined;
2438 'background-pattern'?: string | undefined;
2439 'background-pattern-transition'?: Transition | undefined;
2440 'background-opacity'?: number | Expression | undefined;
2441 'background-opacity-transition'?: Transition | undefined;
2442 }
2443
2444 export interface FillLayout extends Layout {
2445 'fill-sort-key'?: number | Expression | undefined;
2446 }
2447
2448 export interface FillPaint {
2449 'fill-antialias'?: boolean | Expression | undefined;
2450 'fill-opacity'?: number | StyleFunction | Expression | undefined;
2451 'fill-opacity-transition'?: Transition | undefined;
2452 'fill-color'?: string | StyleFunction | Expression | undefined;
2453 'fill-color-transition'?: Transition | undefined;
2454 'fill-outline-color'?: string | StyleFunction | Expression | undefined;
2455 'fill-outline-color-transition'?: Transition | undefined;
2456 'fill-translate'?: number[] | undefined;
2457 'fill-translate-transition'?: Transition | undefined;
2458 'fill-translate-anchor'?: 'map' | 'viewport' | undefined;
2459 'fill-pattern'?: string | Expression | undefined;
2460 'fill-pattern-transition'?: Transition | undefined;
2461 }
2462
2463 export interface FillExtrusionLayout extends Layout {}
2464
2465 export interface FillExtrusionPaint {
2466 'fill-extrusion-opacity'?: number | Expression | undefined;
2467 'fill-extrusion-opacity-transition'?: Transition | undefined;
2468 'fill-extrusion-color'?: string | StyleFunction | Expression | undefined;
2469 'fill-extrusion-color-transition'?: Transition | undefined;
2470 'fill-extrusion-translate'?: number[] | Expression | undefined;
2471 'fill-extrusion-translate-transition'?: Transition | undefined;
2472 'fill-extrusion-translate-anchor'?: 'map' | 'viewport' | undefined;
2473 'fill-extrusion-pattern'?: string | Expression | undefined;
2474 'fill-extrusion-pattern-transition'?: Transition | undefined;
2475 'fill-extrusion-height'?: number | StyleFunction | Expression | undefined;
2476 'fill-extrusion-height-transition'?: Transition | undefined;
2477 'fill-extrusion-base'?: number | StyleFunction | Expression | undefined;
2478 'fill-extrusion-base-transition'?: Transition | undefined;
2479 'fill-extrusion-vertical-gradient'?: boolean | undefined;
2480 }
2481
2482 export interface LineLayout extends Layout {
2483 'line-cap'?: 'butt' | 'round' | 'square' | Expression | undefined;
2484 'line-join'?: 'bevel' | 'round' | 'miter' | Expression | undefined;
2485 'line-miter-limit'?: number | Expression | undefined;
2486 'line-round-limit'?: number | Expression | undefined;
2487 'line-sort-key'?: number | Expression | undefined;
2488 }
2489
2490 export interface LinePaint {
2491 'line-opacity'?: number | StyleFunction | Expression | undefined;
2492 'line-opacity-transition'?: Transition | undefined;
2493 'line-color'?: string | StyleFunction | Expression | undefined;
2494 'line-color-transition'?: Transition | undefined;
2495 'line-translate'?: number[] | Expression | undefined;
2496 'line-translate-transition'?: Transition | undefined;
2497 'line-translate-anchor'?: 'map' | 'viewport' | undefined;
2498 'line-width'?: number | StyleFunction | Expression | undefined;
2499 'line-width-transition'?: Transition | undefined;
2500 'line-gap-width'?: number | StyleFunction | Expression | undefined;
2501 'line-gap-width-transition'?: Transition | undefined;
2502 'line-offset'?: number | StyleFunction | Expression | undefined;
2503 'line-offset-transition'?: Transition | undefined;
2504 'line-blur'?: number | StyleFunction | Expression | undefined;
2505 'line-blur-transition'?: Transition | undefined;
2506 'line-dasharray'?: number[] | Expression | undefined;
2507 'line-dasharray-transition'?: Transition | undefined;
2508 'line-pattern'?: string | Expression | undefined;
2509 'line-pattern-transition'?: Transition | undefined;
2510 'line-gradient'?: Expression | undefined;
2511 }
2512
2513 export interface SymbolLayout extends Layout {
2514 'symbol-placement'?: 'point' | 'line' | 'line-center' | undefined;
2515 'symbol-spacing'?: number | Expression | undefined;
2516 'symbol-avoid-edges'?: boolean | undefined;
2517 'symbol-z-order'?: 'viewport-y' | 'source' | undefined;
2518 'icon-allow-overlap'?: boolean | StyleFunction | Expression | undefined;
2519 'icon-ignore-placement'?: boolean | Expression | undefined;
2520 'icon-optional'?: boolean | undefined;
2521 'icon-rotation-alignment'?: 'map' | 'viewport' | 'auto' | undefined;
2522 'icon-size'?: number | StyleFunction | Expression | undefined;
2523 'icon-text-fit'?: 'none' | 'both' | 'width' | 'height' | undefined;
2524 'icon-text-fit-padding'?: number[] | Expression | undefined;
2525 'icon-image'?: string | StyleFunction | Expression | undefined;
2526 'icon-rotate'?: number | StyleFunction | Expression | undefined;
2527 'icon-padding'?: number | Expression | undefined;
2528 'icon-keep-upright'?: boolean | undefined;
2529 'icon-offset'?: number[] | StyleFunction | Expression | undefined;
2530 'icon-anchor'?: Anchor | StyleFunction | Expression | undefined;
2531 'icon-pitch-alignment'?: 'map' | 'viewport' | 'auto' | undefined;
2532 'text-pitch-alignment'?: 'map' | 'viewport' | 'auto' | undefined;
2533 'text-rotation-alignment'?: 'map' | 'viewport' | 'auto' | undefined;
2534 'text-field'?: string | StyleFunction | Expression | undefined;
2535 'text-font'?: string[] | Expression | undefined;
2536 'text-size'?: number | StyleFunction | Expression | undefined;
2537 'text-max-width'?: number | StyleFunction | Expression | undefined;
2538 'text-line-height'?: number | Expression | undefined;
2539 'text-letter-spacing'?: number | Expression | undefined;
2540 'text-justify'?: 'auto' | 'left' | 'center' | 'right' | Expression | undefined;
2541 'text-anchor'?: Anchor | StyleFunction | Expression | undefined;
2542 'text-max-angle'?: number | Expression | undefined;
2543 'text-rotate'?: number | StyleFunction | Expression | undefined;
2544 'text-padding'?: number | Expression | undefined;
2545 'text-keep-upright'?: boolean | undefined;
2546 'text-transform'?: 'none' | 'uppercase' | 'lowercase' | StyleFunction | Expression | undefined;
2547 'text-offset'?: number[] | Expression | undefined;
2548 'text-allow-overlap'?: boolean | undefined;
2549 'text-ignore-placement'?: boolean | undefined;
2550 'text-optional'?: boolean | undefined;
2551 'text-radial-offset'?: number | Expression | undefined;
2552 'text-variable-anchor'?: Anchor[] | undefined;
2553 'text-writing-mode'?: ('horizontal' | 'vertical')[] | undefined;
2554 'symbol-sort-key'?: number | Expression | undefined;
2555 }
2556
2557 export interface SymbolPaint {
2558 'icon-opacity'?: number | StyleFunction | Expression | undefined;
2559 'icon-opacity-transition'?: Transition | undefined;
2560 'icon-color'?: string | StyleFunction | Expression | undefined;
2561 'icon-color-transition'?: Transition | undefined;
2562 'icon-halo-color'?: string | StyleFunction | Expression | undefined;
2563 'icon-halo-color-transition'?: Transition | undefined;
2564 'icon-halo-width'?: number | StyleFunction | Expression | undefined;
2565 'icon-halo-width-transition'?: Transition | undefined;
2566 'icon-halo-blur'?: number | StyleFunction | Expression | undefined;
2567 'icon-halo-blur-transition'?: Transition | undefined;
2568 'icon-translate'?: number[] | Expression | undefined;
2569 'icon-translate-transition'?: Transition | undefined;
2570 'icon-translate-anchor'?: 'map' | 'viewport' | undefined;
2571 'text-opacity'?: number | StyleFunction | Expression | undefined;
2572 'text-opacity-transition'?: Transition | undefined;
2573 'text-color'?: string | StyleFunction | Expression | undefined;
2574 'text-color-transition'?: Transition | undefined;
2575 'text-halo-color'?: string | StyleFunction | Expression | undefined;
2576 'text-halo-color-transition'?: Transition | undefined;
2577 'text-halo-width'?: number | StyleFunction | Expression | undefined;
2578 'text-halo-width-transition'?: Transition | undefined;
2579 'text-halo-blur'?: number | StyleFunction | Expression | undefined;
2580 'text-halo-blur-transition'?: Transition | undefined;
2581 'text-translate'?: number[] | Expression | undefined;
2582 'text-translate-transition'?: Transition | undefined;
2583 'text-translate-anchor'?: 'map' | 'viewport' | undefined;
2584 }
2585
2586 export interface RasterLayout extends Layout {}
2587
2588 export interface RasterPaint {
2589 'raster-opacity'?: number | Expression | undefined;
2590 'raster-opacity-transition'?: Transition | undefined;
2591 'raster-hue-rotate'?: number | Expression | undefined;
2592 'raster-hue-rotate-transition'?: Transition | undefined;
2593 'raster-brightness-min'?: number | Expression | undefined;
2594 'raster-brightness-min-transition'?: Transition | undefined;
2595 'raster-brightness-max'?: number | Expression | undefined;
2596 'raster-brightness-max-transition'?: Transition | undefined;
2597 'raster-saturation'?: number | Expression | undefined;
2598 'raster-saturation-transition'?: Transition | undefined;
2599 'raster-contrast'?: number | Expression | undefined;
2600 'raster-contrast-transition'?: Transition | undefined;
2601 'raster-fade-duration'?: number | Expression | undefined;
2602 'raster-resampling'?: 'linear' | 'nearest' | undefined;
2603 }
2604
2605 export interface CircleLayout extends Layout {
2606 'circle-sort-key'?: number | Expression | undefined;
2607 }
2608
2609 export interface CirclePaint {
2610 'circle-radius'?: number | StyleFunction | Expression | undefined;
2611 'circle-radius-transition'?: Transition | undefined;
2612 'circle-color'?: string | StyleFunction | Expression | undefined;
2613 'circle-color-transition'?: Transition | undefined;
2614 'circle-blur'?: number | StyleFunction | Expression | undefined;
2615 'circle-blur-transition'?: Transition | undefined;
2616 'circle-opacity'?: number | StyleFunction | Expression | undefined;
2617 'circle-opacity-transition'?: Transition | undefined;
2618 'circle-translate'?: number[] | Expression | undefined;
2619 'circle-translate-transition'?: Transition | undefined;
2620 'circle-translate-anchor'?: 'map' | 'viewport' | undefined;
2621 'circle-pitch-scale'?: 'map' | 'viewport' | undefined;
2622 'circle-pitch-alignment'?: 'map' | 'viewport' | undefined;
2623 'circle-stroke-width'?: number | StyleFunction | Expression | undefined;
2624 'circle-stroke-width-transition'?: Transition | undefined;
2625 'circle-stroke-color'?: string | StyleFunction | Expression | undefined;
2626 'circle-stroke-color-transition'?: Transition | undefined;
2627 'circle-stroke-opacity'?: number | StyleFunction | Expression | undefined;
2628 'circle-stroke-opacity-transition'?: Transition | undefined;
2629 }
2630
2631 export interface HeatmapLayout extends Layout {}
2632
2633 export interface HeatmapPaint {
2634 'heatmap-radius'?: number | StyleFunction | Expression | undefined;
2635 'heatmap-radius-transition'?: Transition | undefined;
2636 'heatmap-weight'?: number | StyleFunction | Expression | undefined;
2637 'heatmap-intensity'?: number | StyleFunction | Expression | undefined;
2638 'heatmap-intensity-transition'?: Transition | undefined;
2639 'heatmap-color'?: string | StyleFunction | Expression | undefined;
2640 'heatmap-opacity'?: number | StyleFunction | Expression | undefined;
2641 'heatmap-opacity-transition'?: Transition | undefined;
2642 }
2643
2644 export interface HillshadeLayout extends Layout {}
2645
2646 export interface HillshadePaint {
2647 'hillshade-illumination-direction'?: number | Expression | undefined;
2648 'hillshade-illumination-anchor'?: 'map' | 'viewport' | undefined;
2649 'hillshade-exaggeration'?: number | Expression | undefined;
2650 'hillshade-exaggeration-transition'?: Transition | undefined;
2651 'hillshade-shadow-color'?: string | Expression | undefined;
2652 'hillshade-shadow-color-transition'?: Transition | undefined;
2653