@independo/leaflet-independo-maps/dist/types/pictogram-marker.d.ts

Leaflet plugin for displaying points of interest as pictograms.

import L, { LatLngExpression, Map } from "leaflet";
import { Pictogram } from "./models/pictogram";
import { PointOfInterest } from "./models/point-of-interest";
export interface PictogramMarkerOptions {
    /**
     * Whether to add the pictogram description to the pictogram marker in case a description is available.
     *
     * @default false
     */
    addDescription?: boolean;
    /**
     * Whether to bring the pictogram marker to the front when clicked.
     *
     * @default true
     */
    bringToFrontOnClick?: boolean;
    /**
     * Whether to bring the pictogram marker to the front when hovered.
     *
     * @default true
     */
    bringToFrontOnHover?: boolean;
    /**
     * Whether to bring the pictogram marker to the front when focused.
     *
     * @default true
     */
    bringToFrontOnFocus?: boolean;
    /**
     * A callback function that is called when the pictogram marker is clicked.
     *
     * @default undefined
     */
    onClick?: (pictogram: Pictogram, pointOfInterest?: PointOfInterest) => void;
}
/**
 * A custom Leaflet layer that displays a pictogram marker at a specified geographical location.
 *
 * This marker supports accessibility features, customizable interactions, and flexible styling.
 * It is designed to be used with the Leaflet library and integrates easily into any Leaflet map.
 */
export declare class PictogramMarker extends L.Layer {
    private readonly addDescription;
    private readonly bringToFrontOnClick;
    private readonly bringToFrontOnHover;
    private readonly bringToFrontOnFocus;
    private readonly onClick;
    private readonly _latlng;
    private readonly _pictogram;
    private readonly _pointOfInterest;
    private container?;
    private box?;
    private map;
    getLatLng(): L.LatLng;
    /**
     * Constructs a new instance of the `PictogramMarker` class.
     *
     * @param latlng - The geographical coordinates where the marker should be placed.
     * @param pictogram - The pictogram object containing the display data (e.g., URL, label, description).
     * @param pointOfInterest - (Optional) The associated point of interest for this marker.
     * @param options - (Optional) Configuration options for the marker's behavior and interactivity.
     *
     * @example
     * ```typescript
     * const latlng = L.latLng(48.20849, 16.37208);
     * const pictogram = {
     *     id: '1',
     *     url: 'https://example.com/pictogram.png',
     *     displayText: 'Restaurant',
     *     description: 'A fine dining restaurant serving local cuisine.'
     * };
     *
     * const options = {
     *     addDescription: true,
     *     bringToFrontOnClick: true,
     *     onClick: (pictogram) => {
     *         console.log('Pictogram clicked:', pictogram);
     *     }
     * };
     *
     * const marker = new PictogramMarker(latlng, pictogram, undefined, options);
     * marker.addTo(map);
     * ```
     */
    constructor(latlng: LatLngExpression, pictogram: Pictogram, pointOfInterest?: PointOfInterest, options?: PictogramMarkerOptions);
    onAdd(map: Map): this;
    onRemove(map: Map): this;
    private updatePosition;
    private setupInteractions;
    private toggleInFront;
}
export declare function pictogramMarker(latlng: LatLngExpression, pictogram: Pictogram, pointOfInterest?: PointOfInterest, options?: PictogramMarkerOptions): PictogramMarker;