Class default

A geocoder component that works with maplibre

Constructors

constructor

Methods

_collapse _geocode _getConfigForRequest _hideButton _onBlur _onChange _onKeyDown _onPaste _onQueryResult _renderError _renderMessage _renderNoResults _showButton _unCollapse _updateProximity addTo clear createIcon getBbox getCountries getFilter getFlyTo getGeocoderApi getLanguage getLimit getMinLength getPlaceholder getProximity getRenderFunction getTypes getZoom off on onAdd once onRemove query setBbox setCountries setFilter setFlyTo setGeocoderApi setInput setLanguage setLimit setMinLength setPlaceholder setProximity setRenderFunction setTypes setZoom

Constructors

constructor

Methods

_collapse

_geocode

_getConfigForRequest

_hideButton

_onBlur

  • _onBlur(e: any): void

    Parameters

    • e: any

    Returns void

_onChange

_onKeyDown

  • _onKeyDown(e: any): void | "none"

    Parameters

    • e: any

    Returns void | "none"

_onPaste

  • _onPaste(e: any): void

    Parameters

    • e: any

    Returns void

_onQueryResult

_renderError

_renderMessage

  • _renderMessage(msg: any): void

    Parameters

    • msg: any

    Returns void

_renderNoResults

_showButton

_unCollapse

_updateProximity

addTo

  • addTo(container: string | Map$1 | HTMLElement): void

    Add the geocoder to a container. The container can be either a Map, an HTMLElement or a CSS selector string.

    If the container is a Map, this function will behave identically to Map.addControl(geocoder). If the container is an instance of HTMLElement, then the geocoder will be appended as a child of that HTMLElement. If the container is a CSS selector string, the geocoder will be appended to the element returned from the query.

    This function will throw an error if the container is none of the above. It will also throw an error if the referenced HTML element cannot be found in the document.body.

    For example, if the HTML body contains the element <div id='geocoder-container'></div>, the following script will append the geocoder to #geocoder-container:

    Parameters

    • container: string | Map$1 | HTMLElement

      A reference to the container to which to add the geocoder

    Returns void

    Example

    const GeoApi = {
      forwardGeocode: (config) => { return { features: [] } },
      reverseGeocode: (config) => { return { features: [] } }
    }
    const geocoder = new MaplibreGeocoder(GeoAPI, {});
    geocoder.addTo('#geocoder-container');

clear

  • clear(ev?: Event): void

    Clear and then focus the input.

    Parameters

    • Optionalev: Event

      the event that triggered the clear, if available

    Returns void

createIcon

  • createIcon(name: string, path: string): SVGSVGElement

    Parameters

    • name: string
    • path: string

    Returns SVGSVGElement

getBbox

  • getBbox(): number[]

    Get the bounding box used by the plugin

    Returns number[]

    the bounding box, if any

getCountries

  • getCountries(): string

    Get a list of the countries to limit search results to

    Returns string

    a comma separated list of countries to limit to, if any

getFilter

getFlyTo

  • getFlyTo(): boolean | FlyToOptions

    Get the parameters used to fly to the selected response, if any

    Returns boolean | FlyToOptions

    The flyTo option

getGeocoderApi

getLanguage

  • getLanguage(): string

    Get the language to use in UI elements and when making search requests

    Returns string

    The language(s) used by the plugin, if any

getLimit

  • getLimit(): number

    Get the limit value for the number of results to display used by the plugin

    Returns number

    The limit value for the number of results to display used by the plugin

getMinLength

  • getMinLength(): number

    Get the minimum number of characters typed to trigger results used in the plugin

    Returns number

    The minimum length in characters before a search is triggered

getPlaceholder

  • getPlaceholder(): string

    Get the value of the placeholder string

    Returns string

    The input element's placeholder value

getProximity

  • getProximity(): { latitude: number; longitude: number }

    Get proximity

    Returns { latitude: number; longitude: number }

    The geocoder proximity

getRenderFunction

getTypes

  • getTypes(): string

    Get a list of the types to limit search results to

    Returns string

    a comma separated list of types to limit to

getZoom

  • getZoom(): number

    Get the zoom level the map will move to when there is no bounding box on the selected result

    Returns number

    the map zoom

off

  • off(type: string, fn: (e: any) => void): this

    Remove an event

    Parameters

    • type: string

      Event name.

    • fn: (e: any) => void

      Function that should unsubscribe to the event emitted.

    Returns this

on

  • on(type: string, fn: (e: any) => void): this

    Subscribe to events that happen within the plugin.

    Parameters

    • type: string

      name of event. Available events and the data passed into their respective event objects are:

      • clear Emitted when the input is cleared
      • loading { query } Emitted when the geocoder is looking up a query
      • results { results } Fired when the geocoder returns a response
      • result { result } Fired when input is set
      • error { error } Error as string
    • fn: (e: any) => void

      function that's called when the event is emitted.

    Returns this

onAdd

  • onAdd(map?: Map$1): HTMLElement

    Parameters

    • Optionalmap: Map$1

    Returns HTMLElement

once

  • once(type: string): Promise<any>

    Subscribe to events that happen within the plugin only once.

    Parameters

    • type: string

      Event name. Available events and the data passed into their respective event objects are:

      • clear Emitted when the input is cleared
      • loading { query } Emitted when the geocoder is looking up a query
      • results { results } Fired when the geocoder returns a response
      • result { result } Fired when input is set
      • error { error } Error as string

    Returns Promise<any>

    a Promise that resolves when the event is emitted.

onRemove

query

  • query(searchInput: string): Promise<void>

    Set & query the input

    Parameters

    • searchInput: string

      location name or other search input

    Returns Promise<void>

setBbox

  • setBbox(bbox: [number, number, number, number]): this

    Set the bounding box to limit search results to

    Parameters

    • bbox: [number, number, number, number]

      a bounding box given as an array in the format [minX, minY, maxX, maxY].

    Returns this

setCountries

  • setCountries(countries: string): this

    Set the countries to limit search results to

    Parameters

    • countries: string

      a comma separated list of countries to limit to

    Returns this

setFilter

  • setFilter(filter: (feature: CarmenGeojsonFeature) => boolean): this

    Set the filter function used by the plugin.

    Parameters

    • filter: (feature: CarmenGeojsonFeature) => boolean

      A function which accepts a CarmenGeojsonFeature to filter out results from the Geocoding API response before they are included in the suggestions list. Return true to keep the item, false otherwise.

    Returns this

setFlyTo

  • setFlyTo(flyTo: boolean | FlyToOptions): this

    Set the flyTo options

    Parameters

    • flyTo: boolean | FlyToOptions

      If false, animating the map to a selected result is disabled. If true, animating the map will use the default animation parameters. If an object, it will be passed as options to the map flyTo or fitBounds method providing control over the animation of the transition.

    Returns this

setGeocoderApi

setInput

  • setInput(searchInput: string): this

    Set input

    Parameters

    • searchInput: string

      location name or other search input

    Returns this

setLanguage

  • setLanguage(language?: string): this

    Get the language to use in UI elements and when making search requests

    Look first at the explicitly set options otherwise use the browser's language settings

    Parameters

    • Optionallanguage: string

      Specify the language to use for response text and query result weighting. Options are IETF language tags comprised of a mandatory ISO 639-1 language code and optionally one or more IETF subtags for country or script. More than one value can also be specified, separated by commas.

    Returns this

setLimit

  • setLimit(limit: number): this

    Set the limit value for the number of results to display used by the plugin

    Parameters

    • limit: number

      the number of search results to return

    Returns this

setMinLength

  • setMinLength(minLength: number): this

    Set the minimum number of characters typed to trigger results used by the plugin

    Parameters

    • minLength: number

      the minimum length in characters

    Returns this

setPlaceholder

  • setPlaceholder(placeholder?: string): this

    Set the value of the input element's placeholder

    Parameters

    • Optionalplaceholder: string

      the text to use as the input element's placeholder

    Returns this

setProximity

  • setProximity(proximity: { latitude: number; longitude: number }): this

    Set proximity

    Parameters

    • proximity: { latitude: number; longitude: number }

      The new options.proximity value. This is a geographical point given as an object with latitude and longitude properties.

    Returns this

setRenderFunction

setTypes

  • setTypes(types: string): this

    Set the types to limit search results to

    Parameters

    • types: string

      a comma separated list of types to limit to

    Returns this

setZoom

  • setZoom(zoom: number): this

    Set the zoom level

    Parameters

    • zoom: number

      The zoom level that the map should animate to when a bbox isn't found in the response. If a bbox is found the map will fit to the bbox.

    Returns this

    this

Settings

Member Visibility

On This Page

Constructors
Methods
MMNEPVFCICPMFPCPTTAAATR