@maplibre/ngx-maplibre-gl
Version:
A Angular binding of maplibre-gl
74 lines (73 loc) • 4.12 kB
TypeScript
import { ElementRef, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
import type { LngLatLike, Offset } from 'maplibre-gl';
import { MarkerComponent } from '../marker/marker.component';
import * as i0 from "@angular/core";
/**
* `mgl-popup` - a popup component
* @see [Popup](https://maplibre.org/maplibre-gl-js/docs/API/classes/Popup/)
*
* @category Components
*
* @example
* ```html
* ...
* <mgl-map ...>
* <mgl-popup [lngLat]="[-96, 37.8]" [closeOnClick]="false">
* <h1>Hello world !</h1>
* </mgl-popup>
* ...
* <mgl-marker #myMarker ...> ... </mgl-marker>
* <mgl-popup [marker]="myMarker"> Hello from marker ! </mgl-popup>
* </mgl-map>
* ```
*/
export declare class PopupComponent implements OnChanges, OnInit, OnDestroy {
/** Init injection */
private readonly destroyRef;
private readonly mapService;
/** Init input */
readonly closeButton: import("@angular/core").InputSignal<boolean | undefined>;
/** Init input */
readonly closeOnClick: import("@angular/core").InputSignal<boolean | undefined>;
/** Init input */
readonly closeOnMove: import("@angular/core").InputSignal<boolean | undefined>;
/** Init input */
readonly focusAfterOpen: import("@angular/core").InputSignal<boolean | undefined>;
/** Init input */
readonly anchor: import("@angular/core").InputSignal<import("maplibre-gl").PositionAnchor | undefined>;
/** Init input */
readonly className: import("@angular/core").InputSignal<string | undefined>;
/** Init input */
readonly maxWidth: import("@angular/core").InputSignal<string | undefined>;
/** Init input */
readonly subpixelPositioning: import("@angular/core").InputSignal<boolean | undefined>;
/**
* Dynamic input [ngx]
* Mutually exclusive with `lngLat`
*/
readonly feature: import("@angular/core").InputSignal<import("geojson").Feature<import("geojson").Point, import("geojson").GeoJsonProperties> | undefined>;
/** Dynamic input */
readonly lngLat: import("@angular/core").InputSignal<LngLatLike | undefined>;
/**
* Dynamic input [ngx]
* The targeted marker
*/
readonly marker: import("@angular/core").InputSignal<MarkerComponent | undefined>;
/** Dynamic input */
readonly offset: import("@angular/core").InputSignal<Offset | undefined>;
readonly popupClose: import("@angular/core").OutputEmitterRef<void>;
readonly popupOpen: import("@angular/core").OutputEmitterRef<void>;
/** @hidden */
readonly content: import("@angular/core").Signal<ElementRef<HTMLDivElement>>;
private popupInstance;
constructor();
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
ngOnDestroy(): void;
private createPopup;
private addPopup;
removePopupFromMarker(): void;
getLngLat(lngLat: LngLatLike | undefined, feature: GeoJSON.Feature<GeoJSON.Point> | undefined): LngLatLike;
static ɵfac: i0.ɵɵFactoryDeclaration<PopupComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<PopupComponent, "mgl-popup", never, { "closeButton": { "alias": "closeButton"; "required": false; "isSignal": true; }; "closeOnClick": { "alias": "closeOnClick"; "required": false; "isSignal": true; }; "closeOnMove": { "alias": "closeOnMove"; "required": false; "isSignal": true; }; "focusAfterOpen": { "alias": "focusAfterOpen"; "required": false; "isSignal": true; }; "anchor": { "alias": "anchor"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "subpixelPositioning": { "alias": "subpixelPositioning"; "required": false; "isSignal": true; }; "feature": { "alias": "feature"; "required": false; "isSignal": true; }; "lngLat": { "alias": "lngLat"; "required": false; "isSignal": true; }; "marker": { "alias": "marker"; "required": false; "isSignal": true; }; "offset": { "alias": "offset"; "required": false; "isSignal": true; }; }, { "popupClose": "popupClose"; "popupOpen": "popupOpen"; }, never, ["*"], true, never>;
}