@maplibre/ngx-maplibre-gl
Version:
A Angular binding of maplibre-gl
712 lines (707 loc) • 90.8 kB
TypeScript
import * as _angular_core from '@angular/core';
import { OutputEmitterRef, OnChanges, OnDestroy, ElementRef, SimpleChanges, OnInit, TemplateRef } from '@angular/core';
import * as maplibre_gl from 'maplibre-gl';
import { MapLibreEvent, MapMouseEvent, MapTouchEvent, MapWheelEvent, MapLibreZoomEvent, MapContextEvent, Map, MapDataEvent, MapStyleDataEvent, MapSourceDataEvent, MapLayerMouseEvent, MapLayerTouchEvent, GeolocateControl, FlyToOptions, AnimationOptions, CameraOptions, MapOptions, TerrainSpecification, ProjectionSpecification, LayerSpecification, PopupOptions, MarkerOptions, LngLatLike, Marker, StyleSpecification, LngLatBoundsLike, PointLike, QueryRenderedFeaturesOptions, Popup, IControl, ControlPosition, SourceSpecification, Source, BackgroundLayerSpecification, FillLayerSpecification, FillExtrusionLayerSpecification, LineLayerSpecification, SymbolLayerSpecification, RasterLayerSpecification, CircleLayerSpecification, FilterSpecification, FitBoundsOptions, VectorSourceSpecification, RasterDEMSourceSpecification, RasterSourceSpecification, ImageSourceSpecification, CanvasSourceSpecification, Offset, Unit, MapGeoJSONFeature } from 'maplibre-gl';
import * as rxjs from 'rxjs';
import * as geojson from 'geojson';
interface EventData {
[key: string]: any;
}
interface MapEvent {
mapResize: OutputEmitterRef<MapLibreEvent & EventData>;
mapRemove: OutputEmitterRef<MapLibreEvent & EventData>;
mapMouseDown: OutputEmitterRef<MapMouseEvent & EventData>;
mapMouseUp: OutputEmitterRef<MapMouseEvent & EventData>;
mapMouseMove: OutputEmitterRef<MapMouseEvent & EventData>;
mapClick: OutputEmitterRef<MapMouseEvent & EventData>;
mapDblClick: OutputEmitterRef<MapMouseEvent & EventData>;
mapMouseOver: OutputEmitterRef<MapMouseEvent & EventData>;
mapMouseOut: OutputEmitterRef<MapMouseEvent & EventData>;
mapContextMenu: OutputEmitterRef<MapMouseEvent & EventData>;
mapTouchStart: OutputEmitterRef<MapTouchEvent & EventData>;
mapTouchEnd: OutputEmitterRef<MapTouchEvent & EventData>;
mapTouchMove: OutputEmitterRef<MapTouchEvent & EventData>;
mapTouchCancel: OutputEmitterRef<MapTouchEvent & EventData>;
mapWheel: OutputEmitterRef<MapWheelEvent & EventData>;
moveStart: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
move: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
moveEnd: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
mapDragStart: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
mapDrag: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
mapDragEnd: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
zoomStart: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
zoomEvt: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
zoomEnd: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
rotateStart: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
rotate: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
rotateEnd: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
pitchStart: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
pitchEvt: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
pitchEnd: OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
boxZoomStart: OutputEmitterRef<MapLibreZoomEvent & EventData>;
boxZoomEnd: OutputEmitterRef<MapLibreZoomEvent & EventData>;
boxZoomCancel: OutputEmitterRef<MapLibreZoomEvent & EventData>;
webGlContextLost: OutputEmitterRef<MapContextEvent & EventData>;
webGlContextRestored: OutputEmitterRef<MapContextEvent & EventData>;
mapLoad: OutputEmitterRef<Map>;
render: OutputEmitterRef<MapLibreEvent & EventData>;
mapError: OutputEmitterRef<ErrorEvent & EventData>;
data: OutputEmitterRef<MapDataEvent & EventData>;
styleData: OutputEmitterRef<MapStyleDataEvent & EventData>;
sourceData: OutputEmitterRef<MapSourceDataEvent & EventData>;
dataLoading: OutputEmitterRef<MapDataEvent & EventData>;
styleDataLoading: OutputEmitterRef<MapStyleDataEvent & EventData>;
sourceDataLoading: OutputEmitterRef<MapSourceDataEvent & EventData>;
styleImageMissing: OutputEmitterRef<{
id: string;
} & EventData>;
idle: OutputEmitterRef<MapLibreEvent & EventData>;
}
interface LayerEvents {
layerClick: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerDblClick: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseDown: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseUp: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseEnter: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseLeave: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseMove: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseOver: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerMouseOut: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerContextMenu: OutputEmitterRef<MapLayerMouseEvent & EventData>;
layerTouchStart: OutputEmitterRef<MapLayerTouchEvent & EventData>;
layerTouchEnd: OutputEmitterRef<MapLayerTouchEvent & EventData>;
layerTouchCancel: OutputEmitterRef<MapLayerTouchEvent & EventData>;
}
/**
* in typescript 4.1 DOM interface Position and Coordinates renamed to GeolocationPosition GeolocationCoordinates
* to avoid deprecation angular version < 11.0.0 we declared own Coordinates, Position interface
*/
interface NgxMapLibreGeolocationCoordinates {
readonly accuracy: number;
readonly altitude: number | null;
readonly altitudeAccuracy: number | null;
readonly heading: number | null;
readonly latitude: number;
readonly longitude: number;
readonly speed: number | null;
}
interface Position {
coords: NgxMapLibreGeolocationCoordinates;
target: GeolocateControl;
timestamp: number;
type: string;
}
type MapImageData = HTMLImageElement | ArrayBufferView | {
width: number;
height: number;
data: Uint8Array | Uint8ClampedArray;
} | ImageData | ImageBitmap;
interface MapImageOptions {
pixelRatio: number;
sdf: boolean;
}
interface SetupMap {
mapOptions: Omit<MapOptions, 'bearing' | 'pitch' | 'zoom'> & {
bearing?: [number];
pitch?: [number];
zoom?: [number];
terrain?: TerrainSpecification;
projection?: ProjectionSpecification;
};
mapEvents: MapEvent;
}
interface SetupLayer {
layerOptions: LayerSpecification;
layerEvents: LayerEvents;
}
interface SetupPopup {
popupOptions: PopupOptions;
popupEvents: {
popupOpen: OutputEmitterRef<void>;
popupClose: OutputEmitterRef<void>;
};
}
/**
* @private
*/
interface SetupMarkerOptions extends MarkerOptions {
element: HTMLElement;
feature?: GeoJSON.Feature<GeoJSON.Point>;
lngLat?: LngLatLike;
}
interface SetupMarker {
markersOptions: SetupMarkerOptions;
markersEvents: {
markerDragStart: OutputEmitterRef<Marker>;
markerDrag: OutputEmitterRef<Marker>;
markerDragEnd: OutputEmitterRef<Marker>;
};
}
type MovingOptions = FlyToOptions | (AnimationOptions & CameraOptions) | CameraOptions;
/**
* @private
*/
declare class MapService {
private readonly zone;
mapInstance: Map;
mapEvents: MapEvent;
private readonly subscriptionsPerInstance;
private readonly mapCreated;
private readonly mapLoaded;
private readonly markersToRemove;
private readonly popupsToRemove;
private readonly imageIdsToRemove;
readonly mapCreated$: rxjs.Observable<void>;
readonly mapLoaded$: rxjs.Observable<void>;
setup(options: SetupMap): void;
destroyMap(): void;
updateMinZoom(minZoom: number): void;
updateMaxZoom(maxZoom: number): void;
updateMinPitch(minPitch: number): void;
updateMaxPitch(maxPitch: number): void;
updateRenderWorldCopies(status: boolean): void;
updateScrollZoom(status: boolean): void;
updateDragRotate(status: boolean): void;
updateTouchPitch(status: boolean): void;
updateTouchZoomRotate(status: boolean): void;
updateDoubleClickZoom(status: boolean): void;
updateKeyboard(status: boolean): void;
updateDragPan(status: boolean): void;
updateBoxZoom(status: boolean): void;
updateStyle(style: StyleSpecification): void;
updateMaxBounds(maxBounds: LngLatBoundsLike): void;
setProjection(options: ProjectionSpecification): void;
setTerrain(options: TerrainSpecification): void;
getTerrain(): TerrainSpecification | null;
setCenterElevation(elevation: number): void;
changeCanvasCursor(cursor: string): void;
queryRenderedFeatures(pointOrBox?: PointLike | [PointLike, PointLike] | QueryRenderedFeaturesOptions, parameters?: QueryRenderedFeaturesOptions): GeoJSON.Feature<GeoJSON.GeometryObject>[];
panTo(center: LngLatLike, options?: AnimationOptions): void;
move(movingMethod: 'jumpTo' | 'easeTo' | 'flyTo', movingOptions?: MovingOptions, zoom?: number, center?: LngLatLike, bearing?: number, pitch?: number, roll?: number): void;
addLayer(layer: SetupLayer, bindEvents: boolean, before?: string): void;
removeLayer(layerId: string): void;
addMarker(marker: SetupMarker): Marker;
removeMarker(marker: Marker): void;
createPopup(popup: SetupPopup, element: Node): Popup;
addPopupToMap(popup: Popup, lngLat: LngLatLike): void;
addPopupToMarker(marker: Marker, popup: Popup): void;
removePopupFromMap(popup: Popup): void;
removePopupFromMarker(marker: Marker): void;
addControl(control: IControl, position?: ControlPosition): void;
removeControl(control: IControl): void;
loadAndAddImage(imageId: string, url: string, options?: MapImageOptions): Promise<void>;
addImage(imageId: string, data: MapImageData, options?: MapImageOptions): void;
removeImage(imageId: string): void;
addSource(sourceId: string, source: SourceSpecification): void;
getSource<T extends Source>(sourceId: string): T;
removeSource(sourceId: string): void;
setAllLayerPaintProperty(layerId: string, paint: BackgroundLayerSpecification['paint'] | FillLayerSpecification['paint'] | FillExtrusionLayerSpecification['paint'] | LineLayerSpecification['paint'] | SymbolLayerSpecification['paint'] | RasterLayerSpecification['paint'] | CircleLayerSpecification['paint']): void;
setAllLayerLayoutProperty(layerId: string, layout: BackgroundLayerSpecification['layout'] | FillLayerSpecification['layout'] | FillExtrusionLayerSpecification['layout'] | LineLayerSpecification['layout'] | SymbolLayerSpecification['layout'] | RasterLayerSpecification['layout'] | CircleLayerSpecification['layout']): void;
setLayerFilter(layerId: string, filter: FilterSpecification | null | undefined): void;
setLayerBefore(layerId: string, beforeId: string): void;
setLayerZoomRange(layerId: string, minZoom?: number, maxZoom?: number): void;
fitBounds(bounds: LngLatBoundsLike, options?: FitBoundsOptions): void;
fitScreenCoordinates(points: [PointLike, PointLike], bearing: number, options?: AnimationOptions & CameraOptions): void;
clearMapElements(): void;
private createMap;
private removeMarkers;
private removePopups;
private removeImages;
private findLayersBySourceId;
private hookEvents;
private createSubscriptionForLayer;
private createSubscriptionForPopup;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MapService, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<MapService>;
}
/**
* `mgl-map` - The main map component
* @see [Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/)
*
* @category Map Component
*
* @example
* ```typescript
* ...
* @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)
* ...
* }
* ```
*/
declare class MapComponent implements OnChanges, OnDestroy, MapEvent {
private readonly mapService;
private readonly elementRef;
/** Init input */
readonly collectResourceTiming: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly crossSourceCollisions: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly customMapboxApiUrl: _angular_core.InputSignal<string | undefined>;
/** Init input */
readonly fadeDuration: _angular_core.InputSignal<number | undefined>;
/** Init input */
readonly hash: _angular_core.InputSignal<string | boolean | undefined>;
/** Init input */
readonly refreshExpiredTiles: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly canvasContextAttributes: _angular_core.InputSignal<maplibre_gl.WebGLContextAttributesWithType | undefined>;
/** Init input */
readonly bearingSnap: _angular_core.InputSignal<number | undefined>;
/** Init input */
readonly interactive: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly pitchWithRotate: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly clickTolerance: _angular_core.InputSignal<number | undefined>;
/** Init input */
readonly attributionControl: _angular_core.InputSignal<false | maplibre_gl.AttributionControlOptions | undefined>;
/** Init input */
readonly logoPosition: _angular_core.InputSignal<maplibre_gl.ControlPosition | undefined>;
/** Init input */
readonly maxTileCacheSize: _angular_core.InputSignal<number | null | undefined>;
/** Init input */
readonly localIdeographFontFamily: _angular_core.InputSignal<string | false | undefined>;
/** Init input */
readonly trackResize: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly transformRequest: _angular_core.InputSignal<maplibre_gl.RequestTransformFunction | null | undefined>;
/** Init input */
readonly bounds: _angular_core.InputSignal<LngLatBoundsLike | undefined>;
/** Init input */
readonly locale: _angular_core.InputSignal<any>;
/** Init input */
readonly cooperativeGestures: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly cancelPendingTileRequestsWhileZooming: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly centerClampedToGround: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly maplibreLogo: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly maxCanvasSize: _angular_core.InputSignal<[number, number] | undefined>;
/** Init input */
readonly maxTileCacheZoomLevels: _angular_core.InputSignal<number | undefined>;
/** Init input */
readonly pixelRatio: _angular_core.InputSignal<number | undefined>;
/** Init input */
readonly rollEnabled: _angular_core.InputSignal<boolean | undefined>;
/** Init input */
readonly transformCameraUpdate: _angular_core.InputSignal<maplibre_gl.CameraUpdateTransformFunction | null | undefined>;
/** Init input */
readonly validateStyle: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly minZoom: _angular_core.InputSignal<number | null | undefined>;
/** Dynamic input */
readonly maxZoom: _angular_core.InputSignal<number | null | undefined>;
/** Dynamic input */
readonly minPitch: _angular_core.InputSignal<number | null | undefined>;
/** Dynamic input */
readonly maxPitch: _angular_core.InputSignal<number | null | undefined>;
/** Dynamic input */
readonly scrollZoom: _angular_core.InputSignal<boolean | maplibre_gl.AroundCenterOptions | undefined>;
/** Dynamic input */
readonly dragRotate: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly touchPitch: _angular_core.InputSignal<boolean | maplibre_gl.AroundCenterOptions | undefined>;
/** Dynamic input */
readonly touchZoomRotate: _angular_core.InputSignal<boolean | maplibre_gl.AroundCenterOptions | undefined>;
/** Dynamic input */
readonly doubleClickZoom: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly keyboard: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly dragPan: _angular_core.InputSignal<boolean | maplibre_gl.DragPanOptions | undefined>;
/** Dynamic input */
readonly boxZoom: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly style: _angular_core.InputSignal<string | maplibre_gl.StyleSpecification | undefined>;
/** Dynamic input */
readonly center: _angular_core.InputSignal<maplibre_gl.LngLatLike | undefined>;
/** Dynamic input */
readonly maxBounds: _angular_core.InputSignal<LngLatBoundsLike | undefined>;
/** Dynamic input */
readonly zoom: _angular_core.InputSignal<[number] | undefined>;
/** Dynamic input */
readonly bearing: _angular_core.InputSignal<[number] | undefined>;
/** Dynamic input */
readonly pitch: _angular_core.InputSignal<[number] | undefined>;
/** Dynamic input */
readonly roll: _angular_core.InputSignal<number | undefined>;
/** Dynamic input */
readonly fitBoundsOptions: _angular_core.InputSignal<maplibre_gl.FitBoundsOptions | undefined>;
/** Dynamic input */
readonly renderWorldCopies: _angular_core.InputSignal<boolean | undefined>;
/** Dynamic input */
readonly elevation: _angular_core.InputSignal<number | undefined>;
/** Dynamic input that is not part of the `MapOptions` object */
readonly terrain: _angular_core.InputSignal<TerrainSpecification | undefined>;
/** Dynamic input that is not part of the `MapOptions` object */
readonly projection: _angular_core.InputSignal<ProjectionSpecification | undefined>;
/** Added by ngx-mapbox-gl */
readonly movingMethod: _angular_core.InputSignal<"jumpTo" | "easeTo" | "flyTo">;
readonly movingOptions: _angular_core.InputSignal<MovingOptions | undefined>;
readonly fitBounds: _angular_core.InputSignal<LngLatBoundsLike | undefined>;
readonly fitScreenCoordinates: _angular_core.InputSignal<[PointLike, PointLike] | undefined>;
readonly centerWithPanTo: _angular_core.InputSignal<boolean | undefined>;
readonly panToOptions: _angular_core.InputSignal<AnimationOptions | undefined>;
readonly cursorStyle: _angular_core.InputSignal<string | undefined>;
readonly mapResize: _angular_core.OutputEmitterRef<MapLibreEvent & EventData>;
readonly mapRemove: _angular_core.OutputEmitterRef<MapLibreEvent & EventData>;
readonly mapMouseDown: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapMouseUp: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapMouseMove: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapClick: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapDblClick: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapMouseOver: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapMouseOut: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapContextMenu: _angular_core.OutputEmitterRef<MapMouseEvent & EventData>;
readonly mapTouchStart: _angular_core.OutputEmitterRef<MapTouchEvent & EventData>;
readonly mapTouchEnd: _angular_core.OutputEmitterRef<MapTouchEvent & EventData>;
readonly mapTouchMove: _angular_core.OutputEmitterRef<MapTouchEvent & EventData>;
readonly mapTouchCancel: _angular_core.OutputEmitterRef<MapTouchEvent & EventData>;
readonly mapWheel: _angular_core.OutputEmitterRef<MapWheelEvent & EventData>;
readonly moveStart: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly move: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly moveEnd: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly mapDragStart: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly mapDrag: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly mapDragEnd: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly zoomStart: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly zoomEvt: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly zoomEnd: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | WheelEvent | undefined> & EventData>;
readonly rotateStart: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly rotate: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly rotateEnd: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly pitchStart: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly pitchEvt: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly pitchEnd: _angular_core.OutputEmitterRef<MapLibreEvent<MouseEvent | TouchEvent | undefined> & EventData>;
readonly boxZoomStart: _angular_core.OutputEmitterRef<MapLibreZoomEvent & EventData>;
readonly boxZoomEnd: _angular_core.OutputEmitterRef<MapLibreZoomEvent & EventData>;
readonly boxZoomCancel: _angular_core.OutputEmitterRef<MapLibreZoomEvent & EventData>;
readonly webGlContextLost: _angular_core.OutputEmitterRef<MapContextEvent & EventData>;
readonly webGlContextRestored: _angular_core.OutputEmitterRef<MapContextEvent & EventData>;
readonly mapLoad: _angular_core.OutputEmitterRef<Map>;
readonly idle: _angular_core.OutputEmitterRef<MapLibreEvent & EventData>;
readonly render: _angular_core.OutputEmitterRef<MapLibreEvent & EventData>;
readonly mapError: _angular_core.OutputEmitterRef<ErrorEvent & EventData>;
readonly data: _angular_core.OutputEmitterRef<MapDataEvent & EventData>;
readonly styleData: _angular_core.OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "style";
} & EventData>;
readonly sourceData: _angular_core.OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "source";
isSourceLoaded: boolean;
source: maplibre_gl.SourceSpecification;
sourceId: string;
sourceDataType: maplibre_gl.MapSourceDataType;
sourceDataChanged?: boolean;
tile: any;
} & EventData>;
readonly dataLoading: _angular_core.OutputEmitterRef<MapDataEvent & EventData>;
readonly styleDataLoading: _angular_core.OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "style";
} & EventData>;
readonly sourceDataLoading: _angular_core.OutputEmitterRef<MapLibreEvent<unknown> & {
dataType: "source";
isSourceLoaded: boolean;
source: maplibre_gl.SourceSpecification;
sourceId: string;
sourceDataType: maplibre_gl.MapSourceDataType;
sourceDataChanged?: boolean;
tile: any;
} & EventData>;
readonly styleImageMissing: _angular_core.OutputEmitterRef<{
id: string;
} & EventData>;
get mapInstance(): Map;
readonly mapContainer: _angular_core.Signal<ElementRef<HTMLDivElement>>;
constructor();
ngOnDestroy(): void;
ngOnChanges(changes: SimpleChanges): Promise<void>;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MapComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<MapComponent, "mgl-map", never, { "collectResourceTiming": { "alias": "collectResourceTiming"; "required": false; "isSignal": true; }; "crossSourceCollisions": { "alias": "crossSourceCollisions"; "required": false; "isSignal": true; }; "customMapboxApiUrl": { "alias": "customMapboxApiUrl"; "required": false; "isSignal": true; }; "fadeDuration": { "alias": "fadeDuration"; "required": false; "isSignal": true; }; "hash": { "alias": "hash"; "required": false; "isSignal": true; }; "refreshExpiredTiles": { "alias": "refreshExpiredTiles"; "required": false; "isSignal": true; }; "canvasContextAttributes": { "alias": "canvasContextAttributes"; "required": false; "isSignal": true; }; "bearingSnap": { "alias": "bearingSnap"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "pitchWithRotate": { "alias": "pitchWithRotate"; "required": false; "isSignal": true; }; "clickTolerance": { "alias": "clickTolerance"; "required": false; "isSignal": true; }; "attributionControl": { "alias": "attributionControl"; "required": false; "isSignal": true; }; "logoPosition": { "alias": "logoPosition"; "required": false; "isSignal": true; }; "maxTileCacheSize": { "alias": "maxTileCacheSize"; "required": false; "isSignal": true; }; "localIdeographFontFamily": { "alias": "localIdeographFontFamily"; "required": false; "isSignal": true; }; "trackResize": { "alias": "trackResize"; "required": false; "isSignal": true; }; "transformRequest": { "alias": "transformRequest"; "required": false; "isSignal": true; }; "bounds": { "alias": "bounds"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "cooperativeGestures": { "alias": "cooperativeGestures"; "required": false; "isSignal": true; }; "cancelPendingTileRequestsWhileZooming": { "alias": "cancelPendingTileRequestsWhileZooming"; "required": false; "isSignal": true; }; "centerClampedToGround": { "alias": "centerClampedToGround"; "required": false; "isSignal": true; }; "maplibreLogo": { "alias": "maplibreLogo"; "required": false; "isSignal": true; }; "maxCanvasSize": { "alias": "maxCanvasSize"; "required": false; "isSignal": true; }; "maxTileCacheZoomLevels": { "alias": "maxTileCacheZoomLevels"; "required": false; "isSignal": true; }; "pixelRatio": { "alias": "pixelRatio"; "required": false; "isSignal": true; }; "rollEnabled": { "alias": "rollEnabled"; "required": false; "isSignal": true; }; "transformCameraUpdate": { "alias": "transformCameraUpdate"; "required": false; "isSignal": true; }; "validateStyle": { "alias": "validateStyle"; "required": false; "isSignal": true; }; "minZoom": { "alias": "minZoom"; "required": false; "isSignal": true; }; "maxZoom": { "alias": "maxZoom"; "required": false; "isSignal": true; }; "minPitch": { "alias": "minPitch"; "required": false; "isSignal": true; }; "maxPitch": { "alias": "maxPitch"; "required": false; "isSignal": true; }; "scrollZoom": { "alias": "scrollZoom"; "required": false; "isSignal": true; }; "dragRotate": { "alias": "dragRotate"; "required": false; "isSignal": true; }; "touchPitch": { "alias": "touchPitch"; "required": false; "isSignal": true; }; "touchZoomRotate": { "alias": "touchZoomRotate"; "required": false; "isSignal": true; }; "doubleClickZoom": { "alias": "doubleClickZoom"; "required": false; "isSignal": true; }; "keyboard": { "alias": "keyboard"; "required": false; "isSignal": true; }; "dragPan": { "alias": "dragPan"; "required": false; "isSignal": true; }; "boxZoom": { "alias": "boxZoom"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": true; "isSignal": true; }; "center": { "alias": "center"; "required": false; "isSignal": true; }; "maxBounds": { "alias": "maxBounds"; "required": false; "isSignal": true; }; "zoom": { "alias": "zoom"; "required": false; "isSignal": true; }; "bearing": { "alias": "bearing"; "required": false; "isSignal": true; }; "pitch": { "alias": "pitch"; "required": false; "isSignal": true; }; "roll": { "alias": "roll"; "required": false; "isSignal": true; }; "fitBoundsOptions": { "alias": "fitBoundsOptions"; "required": false; "isSignal": true; }; "renderWorldCopies": { "alias": "renderWorldCopies"; "required": false; "isSignal": true; }; "elevation": { "alias": "elevation"; "required": false; "isSignal": true; }; "terrain": { "alias": "terrain"; "required": false; "isSignal": true; }; "projection": { "alias": "projection"; "required": false; "isSignal": true; }; "movingMethod": { "alias": "movingMethod"; "required": false; "isSignal": true; }; "movingOptions": { "alias": "movingOptions"; "required": false; "isSignal": true; }; "fitBounds": { "alias": "fitBounds"; "required": false; "isSignal": true; }; "fitScreenCoordinates": { "alias": "fitScreenCoordinates"; "required": false; "isSignal": true; }; "centerWithPanTo": { "alias": "centerWithPanTo"; "required": false; "isSignal": true; }; "panToOptions": { "alias": "panToOptions"; "required": false; "isSignal": true; }; "cursorStyle": { "alias": "cursorStyle"; "required": false; "isSignal": true; }; }, { "mapResize": "mapResize"; "mapRemove": "mapRemove"; "mapMouseDown": "mapMouseDown"; "mapMouseUp": "mapMouseUp"; "mapMouseMove": "mapMouseMove"; "mapClick": "mapClick"; "mapDblClick": "mapDblClick"; "mapMouseOver": "mapMouseOver"; "mapMouseOut": "mapMouseOut"; "mapContextMenu": "mapContextMenu"; "mapTouchStart": "mapTouchStart"; "mapTouchEnd": "mapTouchEnd"; "mapTouchMove": "mapTouchMove"; "mapTouchCancel": "mapTouchCancel"; "mapWheel": "mapWheel"; "moveStart": "moveStart"; "move": "move"; "moveEnd": "moveEnd"; "mapDragStart": "mapDragStart"; "mapDrag": "mapDrag"; "mapDragEnd": "mapDragEnd"; "zoomStart": "zoomStart"; "zoomEvt": "zoomEvt"; "zoomEnd": "zoomEnd"; "rotateStart": "rotateStart"; "rotate": "rotate"; "rotateEnd": "rotateEnd"; "pitchStart": "pitchStart"; "pitchEvt": "pitchEvt"; "pitchEnd": "pitchEnd"; "boxZoomStart": "boxZoomStart"; "boxZoomEnd": "boxZoomEnd"; "boxZoomCancel": "boxZoomCancel"; "webGlContextLost": "webGlContextLost"; "webGlContextRestored": "webGlContextRestored"; "mapLoad": "mapLoad"; "idle": "idle"; "render": "render"; "mapError": "mapError"; "data": "data"; "styleData": "styleData"; "sourceData": "sourceData"; "dataLoading": "dataLoading"; "styleDataLoading": "styleDataLoading"; "sourceDataLoading": "sourceDataLoading"; "styleImageMissing": "styleImageMissing"; }, never, never, true, never>;
}
/**
* `mgl-layer` - a layer component
* @see [layers](https://maplibre.org/maplibre-style-spec/layers/)
*
* @category Layer Component
*
* @example
* ```html
* ...
* <mgl-map ...>
* <mgl-layer
* id="state-borders"
* type="line"
* [source]="states"
* [paint]="{
* 'line-color': '#627BC1',
* 'line-width': 2
* }"
* ></mgl-layer>
* </mgl-map>
* ```
*/
declare class LayerComponent implements OnInit, OnDestroy, OnChanges, LayerEvents {
/** Init injection */
private readonly destroyRef;
private readonly mapService;
/** Init input */
readonly id: _angular_core.InputSignal<string>;
readonly type: _angular_core.InputSignal<"symbol" | "fill" | "line" | "circle" | "heatmap" | "fill-extrusion" | "raster" | "hillshade" | "color-relief" | "background">;
readonly source: _angular_core.InputSignal<string | undefined>;
readonly metadata: _angular_core.InputSignal<unknown>;
readonly sourceLayer: _angular_core.InputSignal<string | undefined>;
/**
* A flag to enable removeSource clean up functionality
*
* Init input
*/
readonly removeSource: _angular_core.InputSignal<boolean | undefined>;
readonly filter: _angular_core.InputSignal<FilterSpecification | undefined>;
readonly layout: _angular_core.InputSignal<{
visibility?: "visible" | "none";
} | {
"fill-sort-key"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
visibility?: "visible" | "none";
} | {
visibility?: "visible" | "none";
} | {
"line-cap"?: maplibre_gl.PropertyValueSpecification<"butt" | "round" | "square">;
"line-join"?: maplibre_gl.DataDrivenPropertyValueSpecification<"bevel" | "round" | "miter">;
"line-miter-limit"?: maplibre_gl.PropertyValueSpecification<number>;
"line-round-limit"?: maplibre_gl.PropertyValueSpecification<number>;
"line-sort-key"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
visibility?: "visible" | "none";
} | {
"symbol-placement"?: maplibre_gl.PropertyValueSpecification<"point" | "line" | "line-center">;
"symbol-spacing"?: maplibre_gl.PropertyValueSpecification<number>;
"symbol-avoid-edges"?: maplibre_gl.PropertyValueSpecification<boolean>;
"symbol-sort-key"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"symbol-z-order"?: maplibre_gl.PropertyValueSpecification<"auto" | "viewport-y" | "source">;
"icon-allow-overlap"?: maplibre_gl.PropertyValueSpecification<boolean>;
"icon-overlap"?: maplibre_gl.PropertyValueSpecification<"never" | "always" | "cooperative">;
"icon-ignore-placement"?: maplibre_gl.PropertyValueSpecification<boolean>;
"icon-optional"?: maplibre_gl.PropertyValueSpecification<boolean>;
"icon-rotation-alignment"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport" | "auto">;
"icon-size"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"icon-text-fit"?: maplibre_gl.PropertyValueSpecification<"none" | "width" | "height" | "both">;
"icon-text-fit-padding"?: maplibre_gl.PropertyValueSpecification<[number, number, number, number]>;
"icon-image"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ResolvedImageSpecification>;
"icon-rotate"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"icon-padding"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.PaddingSpecification>;
"icon-keep-upright"?: maplibre_gl.PropertyValueSpecification<boolean>;
"icon-offset"?: maplibre_gl.DataDrivenPropertyValueSpecification<[number, number]>;
"icon-anchor"?: maplibre_gl.DataDrivenPropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
"icon-pitch-alignment"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport" | "auto">;
"text-pitch-alignment"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport" | "auto">;
"text-rotation-alignment"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport" | "viewport-glyph" | "auto">;
"text-field"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.FormattedSpecification>;
"text-font"?: maplibre_gl.DataDrivenPropertyValueSpecification<Array<string>>;
"text-size"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-max-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-line-height"?: maplibre_gl.PropertyValueSpecification<number>;
"text-letter-spacing"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-justify"?: maplibre_gl.DataDrivenPropertyValueSpecification<"auto" | "left" | "center" | "right">;
"text-radial-offset"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-variable-anchor"?: maplibre_gl.PropertyValueSpecification<Array<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">>;
"text-variable-anchor-offset"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.VariableAnchorOffsetCollectionSpecification>;
"text-anchor"?: maplibre_gl.DataDrivenPropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
"text-max-angle"?: maplibre_gl.PropertyValueSpecification<number>;
"text-writing-mode"?: maplibre_gl.PropertyValueSpecification<Array<"horizontal" | "vertical">>;
"text-rotate"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-padding"?: maplibre_gl.PropertyValueSpecification<number>;
"text-keep-upright"?: maplibre_gl.PropertyValueSpecification<boolean>;
"text-transform"?: maplibre_gl.DataDrivenPropertyValueSpecification<"none" | "uppercase" | "lowercase">;
"text-offset"?: maplibre_gl.DataDrivenPropertyValueSpecification<[number, number]>;
"text-allow-overlap"?: maplibre_gl.PropertyValueSpecification<boolean>;
"text-overlap"?: maplibre_gl.PropertyValueSpecification<"never" | "always" | "cooperative">;
"text-ignore-placement"?: maplibre_gl.PropertyValueSpecification<boolean>;
"text-optional"?: maplibre_gl.PropertyValueSpecification<boolean>;
visibility?: "visible" | "none";
} | {
visibility?: "visible" | "none";
} | {
"circle-sort-key"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
visibility?: "visible" | "none";
} | {
visibility?: "visible" | "none";
} | {
visibility?: "visible" | "none";
} | {
visibility?: "visible" | "none";
} | undefined>;
readonly paint: _angular_core.InputSignal<{
"background-color"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.ColorSpecification>;
"background-pattern"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.ResolvedImageSpecification>;
"background-opacity"?: maplibre_gl.PropertyValueSpecification<number>;
} | {
"fill-antialias"?: maplibre_gl.PropertyValueSpecification<boolean>;
"fill-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"fill-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"fill-outline-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"fill-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"fill-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"fill-pattern"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ResolvedImageSpecification>;
} | {
"fill-extrusion-opacity"?: maplibre_gl.PropertyValueSpecification<number>;
"fill-extrusion-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"fill-extrusion-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"fill-extrusion-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"fill-extrusion-pattern"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ResolvedImageSpecification>;
"fill-extrusion-height"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"fill-extrusion-base"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"fill-extrusion-vertical-gradient"?: maplibre_gl.PropertyValueSpecification<boolean>;
} | {
"line-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"line-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"line-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"line-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"line-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"line-gap-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"line-offset"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"line-blur"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"line-dasharray"?: maplibre_gl.PropertyValueSpecification<Array<number>>;
"line-pattern"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ResolvedImageSpecification>;
"line-gradient"?: maplibre_gl.ExpressionSpecification;
} | {
"icon-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"icon-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"icon-halo-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"icon-halo-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"icon-halo-blur"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"icon-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"icon-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"text-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"text-halo-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"text-halo-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-halo-blur"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"text-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"text-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
} | {
"raster-opacity"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-hue-rotate"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-brightness-min"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-brightness-max"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-saturation"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-contrast"?: maplibre_gl.PropertyValueSpecification<number>;
"raster-resampling"?: maplibre_gl.PropertyValueSpecification<"linear" | "nearest">;
"raster-fade-duration"?: maplibre_gl.PropertyValueSpecification<number>;
} | {
"circle-radius"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"circle-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"circle-blur"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"circle-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"circle-translate"?: maplibre_gl.PropertyValueSpecification<[number, number]>;
"circle-translate-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"circle-pitch-scale"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"circle-pitch-alignment"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"circle-stroke-width"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"circle-stroke-color"?: maplibre_gl.DataDrivenPropertyValueSpecification<maplibre_gl.ColorSpecification>;
"circle-stroke-opacity"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
} | {
"heatmap-radius"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"heatmap-weight"?: maplibre_gl.DataDrivenPropertyValueSpecification<number>;
"heatmap-intensity"?: maplibre_gl.PropertyValueSpecification<number>;
"heatmap-color"?: maplibre_gl.ExpressionSpecification;
"heatmap-opacity"?: maplibre_gl.PropertyValueSpecification<number>;
} | {
"hillshade-illumination-direction"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.NumberArraySpecification>;
"hillshade-illumination-altitude"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.NumberArraySpecification>;
"hillshade-illumination-anchor"?: maplibre_gl.PropertyValueSpecification<"map" | "viewport">;
"hillshade-exaggeration"?: maplibre_gl.PropertyValueSpecification<number>;
"hillshade-shadow-color"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.ColorArraySpecification>;
"hillshade-highlight-color"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.ColorArraySpecification>;
"hillshade-accent-color"?: maplibre_gl.PropertyValueSpecification<maplibre_gl.ColorSpecification>;
"hillshade-method"?: maplibre_gl.PropertyValueSpecification<"standard" | "basic" | "combined" | "igor" | "multidirectional">;
} | {
"color-relief-opacity"?: maplibre_gl.PropertyValueSpecification<number>;
"color-relief-color"?: maplibre_gl.ExpressionSpecification;
} | undefined>;
readonly before: _angular_core.InputSignal<string | undefined>;
readonly minzoom: _angular_core.InputSignal<number | undefined>;
readonly maxzoom: _angular_core.InputSignal<number | undefined>;
readonly layerClick: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerDblClick: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseDown: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseUp: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseEnter: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseLeave: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseMove: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseOver: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerMouseOut: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerContextMenu: _angular_core.OutputEmitterRef<maplibre_gl.MapMouseEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerTouchStart: _angular_core.OutputEmitterRef<maplibre_gl.MapTouchEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerTouchEnd: _angular_core.OutputEmitterRef<maplibre_gl.MapTouchEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
readonly layerTouchCancel: _angular_core.OutputEmitterRef<maplibre_gl.MapTouchEvent & {
features?: maplibre_gl.MapGeoJSONFeature[];
} & EventData>;
private readonly layerAdded;
private readonly sourceIdAdded;
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
ngOnDestroy(): void;
private init;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LayerComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LayerComponent, "mgl-layer", never, { "id": { "alias": "id"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": true; "isSignal": true; }; "source": { "alias": "source"; "required": false; "isSignal": true; }; "metadata": { "alias": "metadata"; "required": false; "isSignal": true; }; "sourceLayer": { "alias": "sourceLayer"; "required": false; "isSignal": true; }; "removeSource": { "alias": "removeSource"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "paint": { "alias": "paint"; "required": false; "isSignal": true; }; "before": { "alias": "before"; "required": false; "isSignal": true; }; "minzoom": { "alias": "minzoom"; "required": false; "isSignal": true; }; "maxzoom": { "alias": "maxzoom"; "required": false; "isSignal": true; }; }, { "layerClick": "layerClick"; "layerDblClick": "layerDblClick"; "layerMouseDown": "layerMouseDown"; "layerMouseUp": "layerMouseUp"; "layerMouseEnter": "layerMouseEnter"; "layerMouseLeave": "layerMouseLeave"; "layerMouseMove": "layerMouseMove"; "layerMouseOver": "layerMouseOver"; "layerMouseOut": "layerMouseOut"; "layerContextMenu": "layerContextMenu"; "layerTouchStart": "layerTouchStart"; "layerTouchEnd": "layerTouchEnd"; "layerTouchCancel": "layerTouchCancel"; }, never, never, true, never>;
}
/**
* `mglDraggable` - a directive for Feature or Marker
*
* @category Directives
*
* @see [Draggable Marker](https://maplibre.org/ng-maplibre-gl/demo/ngx-drag-a-point)
*/
declare class DraggableDirective implements OnInit, OnDestroy {
/** Init injection */
private readonly mapService;
private readonly ngZone;
private readonly featureComponent;
readonly layer: _angular_core.InputSignal<LayerComponent | null>;
featureDragStart: _angular_core.OutputEmitterRef<MapMouseEvent>;
featureDragEnd: _angular_core.OutputEmitterRef<MapMouseEvent>;
featureDrag: _angular_core.OutputEmitterRef<MapMouseEvent>;
private sub;
ngOnInit(): void;
ngOnDestroy(): void;
private handleDraggable;
private filterFeature;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DraggableDire