Class MapComponent

mgl-map - The main map component

See

Example

...
@Component({
  template: `
  <mgl-map
    [style]="'https://demotiles.maplibre.org/style.json'"
    [zoom]="[9]"
    [center]="[-74.50, 40]"
    (mapLoad)="map = $event"
  ></mgl-map>
  `,
...
})
export class DisplayMapComponent {
  map: Map; // MapLibre GL Map object (MapLibre is ran outside angular zone, keep that in mind when binding events from this object)
...
}

Implements

OnChanges
OnDestroy
MapEvent

Index

Constructors

constructor

new MapComponent(): MapComponent
Returns MapComponent
- Defined in projects/ngx-maplibre-gl/src/lib/map/map.component.ts:275

Properties

`Readonly`antialias

antialias: InputSignal<undefined | boolean> = ...

Init input

`Readonly`attributionControl

attributionControl: InputSignal<undefined | false | AttributionControlOptions> = ...

Init input

`Readonly`bearing

bearing: InputSignal<undefined | [number]> = ...

Dynamic input

`Readonly`bearingSnap

bearingSnap: InputSignal<undefined | number> = ...

Init input

`Readonly`bounds

bounds: InputSignal<undefined | LngLatBoundsLike> = ...

Init input

`Readonly`boxZoom

boxZoom: InputSignal<undefined | boolean> = ...

Dynamic input

`Readonly`boxZoomCancel

boxZoomCancel: OutputEmitterRef<MapLibreZoomEvent & EventData> = ...

`Readonly`boxZoomEnd

boxZoomEnd: OutputEmitterRef<MapLibreZoomEvent & EventData> = ...

`Readonly`boxZoomStart

boxZoomStart: OutputEmitterRef<MapLibreZoomEvent & EventData> = ...

`Readonly`center

center: InputSignal<undefined | LngLatLike> = ...

Dynamic input

`Readonly`centerWithPanTo

centerWithPanTo: InputSignal<undefined | boolean> = ...

`Readonly`clickTolerance

clickTolerance: InputSignal<undefined | number> = ...

Init input

`Readonly`collectResourceTiming

collectResourceTiming: InputSignal<undefined | boolean> = ...

Init input

`Readonly`cooperativeGestures

cooperativeGestures: InputSignal<undefined | boolean> = ...

Init input

`Readonly`crossSourceCollisions

crossSourceCollisions: InputSignal<undefined | boolean> = ...

Init input

`Readonly`cursorStyle

cursorStyle: InputSignal<undefined | string> = ...

`Readonly`customMapboxApiUrl

customMapboxApiUrl: InputSignal<undefined | string> = ...

Init input

`Readonly`data

data: OutputEmitterRef<MapDataEvent & EventData> = ...

`Readonly`dataLoading

dataLoading: OutputEmitterRef<MapDataEvent & EventData> = ...

`Readonly`doubleClickZoom

doubleClickZoom: InputSignal<undefined | boolean> = ...

Dynamic input

`Readonly`dragPan

dragPan: InputSignal<undefined | boolean | DragPanOptions> = ...

Dynamic input

`Readonly`dragRotate

dragRotate: InputSignal<undefined | boolean> = ...

Dynamic input

`Readonly`fadeDuration

fadeDuration: InputSignal<undefined | number> = ...

Init input

`Readonly`failIfMajorPerformanceCaveat

failIfMajorPerformanceCaveat: InputSignal<undefined | boolean> = ...

Init input

`Readonly`fitBounds

fitBounds: InputSignal<undefined | LngLatBoundsLike> = ...

`Readonly`fitBoundsOptions

fitBoundsOptions: InputSignal<undefined | FitBoundsOptions> = ...

Dynamic input

`Readonly`fitScreenCoordinates

fitScreenCoordinates: InputSignal<undefined | [PointLike, PointLike]> = ...

`Readonly`hash

hash: InputSignal<undefined | string | boolean> = ...

Init input

`Readonly`idle

idle: OutputEmitterRef<MapLibreEvent & EventData> = ...

`Readonly`interactive

interactive: InputSignal<undefined | boolean> = ...

Init input

`Readonly`keyboard

keyboard: InputSignal<undefined | boolean> = ...

Dynamic input

`Readonly`localIdeographFontFamily

localIdeographFontFamily: InputSignal<undefined | string | false> = ...

Init input

`Readonly`locale

locale: InputSignal<any> = ...

Init input

`Readonly`logoPosition

logoPosition: InputSignal<undefined | ControlPosition> = ...

Init input

`Readonly`mapClick

mapClick: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapContainer

mapContainer: Signal<ElementRef<HTMLDivElement>> = ...

`Readonly`mapContextMenu

mapContextMenu: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapDblClick

mapDblClick: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapDrag

mapDrag: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`mapDragEnd

mapDragEnd: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`mapDragStart

mapDragStart: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`mapError

mapError: OutputEmitterRef<ErrorEvent & EventData> = ...

`Readonly`mapLoad

mapLoad: OutputEmitterRef<Map$1> = ...

`Readonly`mapMouseDown

mapMouseDown: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapMouseMove

mapMouseMove: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapMouseOut

mapMouseOut: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapMouseOver

mapMouseOver: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapMouseUp

mapMouseUp: OutputEmitterRef<MapMouseEvent & EventData> = ...

`Readonly`mapRemove

mapRemove: OutputEmitterRef<MapLibreEvent & EventData> = ...

`Readonly`mapResize

mapResize: OutputEmitterRef<MapLibreEvent & EventData> = ...

`Readonly`mapTouchCancel

mapTouchCancel: OutputEmitterRef<MapTouchEvent & EventData> = ...

`Readonly`mapTouchEnd

mapTouchEnd: OutputEmitterRef<MapTouchEvent & EventData> = ...

`Readonly`mapTouchMove

mapTouchMove: OutputEmitterRef<MapTouchEvent & EventData> = ...

`Readonly`mapTouchStart

mapTouchStart: OutputEmitterRef<MapTouchEvent & EventData> = ...

`Readonly`mapWheel

mapWheel: OutputEmitterRef<MapWheelEvent & EventData> = ...

`Readonly`maxBounds

maxBounds: InputSignal<undefined | LngLatBoundsLike> = ...

Dynamic input

`Readonly`maxPitch

maxPitch: InputSignal<undefined | null | number> = ...

Dynamic input

`Readonly`maxTileCacheSize

maxTileCacheSize: InputSignal<undefined | null | number> = ...

Init input

`Readonly`maxZoom

maxZoom: InputSignal<undefined | null | number> = ...

Dynamic input

`Readonly`minPitch

minPitch: InputSignal<undefined | null | number> = ...

Dynamic input

`Readonly`minZoom

minZoom: InputSignal<undefined | null | number> = ...

Dynamic input

`Readonly`move

move: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

`Readonly`moveEnd

moveEnd: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

`Readonly`moveStart

moveStart: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

`Readonly`movingMethod

movingMethod: InputSignal<"jumpTo" | "easeTo" | "flyTo"> = ...

Added by ngx-mapbox-gl

`Readonly`movingOptions

movingOptions: InputSignal<undefined | MovingOptions> = ...

`Readonly`panToOptions

panToOptions: InputSignal<undefined | AnimationOptions> = ...

`Readonly`pitch

pitch: InputSignal<undefined | [number]> = ...

Dynamic input

`Readonly`pitchEnd

pitchEnd: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`pitchEvt

pitchEvt: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`pitchStart

pitchStart: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`pitchWithRotate

pitchWithRotate: InputSignal<undefined | boolean> = ...

Init input

`Readonly`preserveDrawingBuffer

preserveDrawingBuffer: InputSignal<undefined | boolean> = ...

Init input

`Readonly`refreshExpiredTiles

refreshExpiredTiles: InputSignal<undefined | boolean> = ...

Init input

`Readonly`render

render: OutputEmitterRef<MapLibreEvent & EventData> = ...

`Readonly`renderWorldCopies

renderWorldCopies: InputSignal<undefined | boolean> = ...

Dynamic input

`Readonly`rotate

rotate: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`rotateEnd

rotateEnd: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`rotateStart

rotateStart: OutputEmitterRef<MapLibreEvent<undefined | MouseEvent | TouchEvent> & EventData> = ...

`Readonly`scrollZoom

scrollZoom: InputSignal<undefined | boolean | AroundCenterOptions> = ...

Dynamic input

`Readonly`sourceData

sourceData: OutputEmitterRef<MapLibreEvent<unknown> & {
    dataType: "source";
    isSourceLoaded: boolean;
    source: SourceSpecification;
    sourceDataType: MapSourceDataType;
    sourceId: string;
    tile: any;
} & EventData> = ...

`Readonly`sourceDataLoading

sourceDataLoading: OutputEmitterRef<MapLibreEvent<unknown> & {
    dataType: "source";
    isSourceLoaded: boolean;
    source: SourceSpecification;
    sourceDataType: MapSourceDataType;
    sourceId: string;
    tile: any;
} & EventData> = ...

`Readonly`style

style: InputSignal<undefined | string | StyleSpecification> = ...

Dynamic input

`Readonly`styleData

styleData: OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "style";
} & EventData> = ...

`Readonly`styleDataLoading

styleDataLoading: OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "style";
} & EventData> = ...

`Readonly`styleImageMissing

styleImageMissing: OutputEmitterRef<{
id: string;
} & EventData> = ...

`Readonly`terrain

terrain: InputSignal<undefined | TerrainSpecification> = ...

Dynamic input

`Readonly`touchPitch

touchPitch: InputSignal<undefined | boolean | AroundCenterOptions> = ...

Dynamic input

`Readonly`touchZoomRotate

touchZoomRotate: InputSignal<undefined | boolean | AroundCenterOptions> = ...

Dynamic input

`Readonly`trackResize

trackResize: InputSignal<undefined | boolean> = ...

Init input

`Readonly`transformRequest

transformRequest: InputSignal<undefined | null | RequestTransformFunction> = ...

Init input

`Readonly`webGlContextLost

webGlContextLost: OutputEmitterRef<MapContextEvent & EventData> = ...

`Readonly`webGlContextRestored

webGlContextRestored: OutputEmitterRef<MapContextEvent & EventData> = ...

`Readonly`zoom

zoom: InputSignal<undefined | [number]> = ...

Dynamic input

`Readonly`zoomEnd

zoomEnd: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

`Readonly`zoomEvt

zoomEvt: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

`Readonly`zoomStart

zoomStart: OutputEmitterRef<MapLibreEvent<
    | undefined
    | MouseEvent
    | TouchEvent
    | WheelEvent> & EventData> = ...

Accessors

mapInstance

get mapInstance(): Map$1
Returns Map$1
- Defined in projects/ngx-maplibre-gl/src/lib/map/map.component.ts:268

Methods

ngOnChanges

ngOnChanges(changes): Promise<void>
A callback method that is invoked immediately after the default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.
Parameters
- changes: SimpleChanges
  The changed properties.
Returns Promise<void>
Implementation of OnChanges.ngOnChanges
- Defined in projects/ngx-maplibre-gl/src/lib/map/map.component.ts:354

ngOnDestroy

ngOnDestroy(): void
A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.

Returns void
Implementation of OnDestroy.ngOnDestroy
- Defined in projects/ngx-maplibre-gl/src/lib/map/map.component.ts:350

Class MapComponent

See

Example

Implements

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Returns MapComponent

Properties

Readonlyantialias

ReadonlyattributionControl

Readonlybearing

ReadonlybearingSnap

Readonlybounds

ReadonlyboxZoom

ReadonlyboxZoomCancel

ReadonlyboxZoomEnd

ReadonlyboxZoomStart

Readonlycenter

ReadonlycenterWithPanTo

ReadonlyclickTolerance

ReadonlycollectResourceTiming

ReadonlycooperativeGestures

ReadonlycrossSourceCollisions

ReadonlycursorStyle

ReadonlycustomMapboxApiUrl

Readonlydata

ReadonlydataLoading

ReadonlydoubleClickZoom

ReadonlydragPan

ReadonlydragRotate

ReadonlyfadeDuration

ReadonlyfailIfMajorPerformanceCaveat

ReadonlyfitBounds

ReadonlyfitBoundsOptions

ReadonlyfitScreenCoordinates

Readonlyhash

Readonlyidle

Readonlyinteractive

Readonlykeyboard

ReadonlylocalIdeographFontFamily

Readonlylocale

ReadonlylogoPosition

ReadonlymapClick

ReadonlymapContainer

ReadonlymapContextMenu

ReadonlymapDblClick

ReadonlymapDrag

ReadonlymapDragEnd

ReadonlymapDragStart

ReadonlymapError

ReadonlymapLoad

ReadonlymapMouseDown

ReadonlymapMouseMove

ReadonlymapMouseOut

ReadonlymapMouseOver

ReadonlymapMouseUp

ReadonlymapRemove

ReadonlymapResize

ReadonlymapTouchCancel

ReadonlymapTouchEnd

ReadonlymapTouchMove

ReadonlymapTouchStart

ReadonlymapWheel

ReadonlymaxBounds

ReadonlymaxPitch

ReadonlymaxTileCacheSize

ReadonlymaxZoom

ReadonlyminPitch

ReadonlyminZoom

Readonlymove

ReadonlymoveEnd

ReadonlymoveStart

ReadonlymovingMethod

ReadonlymovingOptions

ReadonlypanToOptions

`Readonly`antialias

`Readonly`attributionControl

`Readonly`bearing

`Readonly`bearingSnap

`Readonly`bounds

`Readonly`boxZoom

`Readonly`boxZoomCancel

`Readonly`boxZoomEnd

`Readonly`boxZoomStart

`Readonly`center

`Readonly`centerWithPanTo

`Readonly`clickTolerance

`Readonly`collectResourceTiming

`Readonly`cooperativeGestures

`Readonly`crossSourceCollisions

`Readonly`cursorStyle

`Readonly`customMapboxApiUrl

`Readonly`data

`Readonly`dataLoading

`Readonly`doubleClickZoom

`Readonly`dragPan

`Readonly`dragRotate

`Readonly`fadeDuration

`Readonly`failIfMajorPerformanceCaveat

`Readonly`fitBounds

`Readonly`fitBoundsOptions

`Readonly`fitScreenCoordinates

`Readonly`hash

`Readonly`idle

`Readonly`interactive

`Readonly`keyboard

`Readonly`localIdeographFontFamily

`Readonly`locale

`Readonly`logoPosition

`Readonly`mapClick

`Readonly`mapContainer

`Readonly`mapContextMenu

`Readonly`mapDblClick

`Readonly`mapDrag

`Readonly`mapDragEnd

`Readonly`mapDragStart

`Readonly`mapError

`Readonly`mapLoad

`Readonly`mapMouseDown

`Readonly`mapMouseMove

`Readonly`mapMouseOut

`Readonly`mapMouseOver

`Readonly`mapMouseUp

`Readonly`mapRemove

`Readonly`mapResize

`Readonly`mapTouchCancel

`Readonly`mapTouchEnd

`Readonly`mapTouchMove

`Readonly`mapTouchStart

`Readonly`mapWheel

`Readonly`maxBounds

`Readonly`maxPitch

`Readonly`maxTileCacheSize

`Readonly`maxZoom

`Readonly`minPitch

`Readonly`minZoom

`Readonly`move

`Readonly`moveEnd

`Readonly`moveStart

`Readonly`movingMethod

`Readonly`movingOptions

`Readonly`panToOptions

`Readonly`pitch

`Readonly`pitchEnd

`Readonly`pitchEvt

`Readonly`pitchStart

`Readonly`pitchWithRotate

`Readonly`preserveDrawingBuffer

`Readonly`refreshExpiredTiles

`Readonly`render

`Readonly`renderWorldCopies

`Readonly`rotate

`Readonly`rotateEnd

`Readonly`rotateStart

`Readonly`scrollZoom