@maplibre/ngx-maplibre-gl

    Class MarkerComponent

    mgl-marker - a marker component

    Marker

    ...
    <mgl-map ...>
    <mgl-marker [lngLat]="[-66.324462890625, -16.024695711685304]">
    <div (click)="alert('Foo')" class="marker">Hello</div>
    </mgl-marker>
    </mgl-map>

    Note: Only use this if you really need to use HTML/Angular component to render your symbol. These markers are slow compared to a Layer of symbol because they're not rendered using WebGL.

    Implements

    • OnChanges
    • OnInit
    • OnDestroy
    Index

    Constructors

    Properties

    anchor: InputSignal<undefined | PositionAnchor> = ...
    className: InputSignal<undefined | string> = ...
    clickTolerance: InputSignal<undefined | number> = ...
    color: InputSignal<undefined | string> = ...
    content: Signal<ElementRef<HTMLDivElement>> = ...
    draggable: InputSignal<undefined | boolean> = ...
    feature: InputSignal<undefined | Feature<Point, GeoJsonProperties>> = ...

    Dynamic input

    lngLat: InputSignal<undefined | LngLatLike> = ...
    markerDrag: OutputEmitterRef<Marker> = ...
    markerDragEnd: OutputEmitterRef<Marker> = ...
    markerDragStart: OutputEmitterRef<Marker> = ...
    markerInstance: WritableSignal<null | Marker> = ...
    offset: InputSignal<undefined | PointLike> = ...

    Init inputs

    opacity: InputSignal<undefined | string> = ...
    opacityWhenCovered: InputSignal<undefined | string> = ...
    pitchAlignment: InputSignal<undefined | Alignment> = ...
    popupShown: InputSignal<undefined | boolean> = ...
    rotation: InputSignal<undefined | number> = ...
    rotationAlignment: InputSignal<undefined | Alignment> = ...
    scale: InputSignal<undefined | number> = ...
    subpixelPositioning: InputSignal<undefined | boolean> = ...

    Methods

    • 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 void

    • A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.

      Returns void

    MMNEPVFCICPMFPCPTTAAATR