Class WebMapMain<M, E, O>

constructor

• new WebMapMain<M, E, O>(mapOptions): WebMapMain<M, E, O>

• Type Parameters

  • M = any
  • E extends WebMapEvents = WebMapEvents
  • O extends MapOptions<any, any> = MapOptions<any, any>

  Parameters

  • mapOptions: O

  Returns WebMapMain<M, E, O>

Readonlyemitter

getPaintFunctions

id

Readonlykeys

ReadonlymapAdapter

ReadonlymapState

mapStateItems

options

ReadonlyruntimeParams

StaticgetPaintFunctions

Statickeys

create

• create(): Promise<WebMapMain<M, E, O>>

• Manual way to create a map (If MapOptions.create is false).

  Returns Promise<WebMapMain<M, E, O>>

  Example

  const webMap = new WebMap(options);
  webMap.create().then(() => doSomething());
  Copy

destroy

• destroy(): void

• Destroys WebMap, MapAdapter, clears all layers and turn off all event listeners

  Returns void

fitBounds

• fitBounds(bounds, options?): this

• Sets a map view that contains the given geographical bounds.

  Parameters

  • bounds: LngLatBoundsArray

    Array of coordinates, measured in degrees, in [west, south, east, north] order.
  • Optionaloptions: FitOptions

  Returns this

  Example

  // Whole world
  webMap.fitBounds([0, -90, 180, 90]);
  Copy

getBounds

• getBounds(): undefined | LngLatBoundsArray

• Returns undefined | LngLatBoundsArray

getBoundsPolygon

• getBoundsPolygon(): undefined | Feature<Polygon, GeoJsonProperties>

• Returns undefined | Feature<Polygon, GeoJsonProperties>

getCenter

• getCenter(): undefined | LngLatArray

• Returns the map's geographical centerpoint.

  Returns undefined | LngLatArray

  lngLat Array of two numbers representing longitude and latitude of the center of the map view.

  Example

  // Mount Everest 27° 59′ 17″ N, 86° 55′ 31″ E
  webMap.getCenter(); // [86.925278, 27.988056]
  Copy

getContainer

• getContainer(): undefined | HTMLElement

• Returns the HTML element that contains the map.

  Returns undefined | HTMLElement

  The map's container

getCoordFromMapClick

• getCoordFromMapClick(): Promise<LngLatArray>

• Returns Promise<LngLatArray>

getCursor

• getCursor(): undefined | Cursor

• Returns undefined | Cursor

getEventStatus

• getEventStatus(event): boolean

• Checking the status of any asynchronous operation

  Parameters

  • event: keyof E

    The name of the event whose status is checked

  Returns boolean

  Example

  var webMap = new WebMap(options);
  webMap.getEventStatus('create'); // false
  webMap.emitter.on('create', function () {
    webMap.getEventStatus('create'); // true
  })
  Copy

getId

• getId(): number

• Returns number

getLayerAdapter

• getLayerAdapter(name): Type<LayerAdapter>

• Parameters

  • name: string

  Returns Type<LayerAdapter>

getLayerAdapters

• getLayerAdapters(): {
      [name: string]: Type<LayerAdapter>;
  }

• Returns {
      [name: string]: Type<LayerAdapter>;
  }

  • [name: string]: Type<LayerAdapter>

getRuntimeParams

• getRuntimeParams(): Record<string, any>

• Returns Record<string, any>

getState

• getState(): Record<string, any>

• Returns Record<string, any>

getStateAsString

• getStateAsString(): Record<string, any>

• Returns Record<string, any>

getZoom

• getZoom(): undefined | number

• Returns the map's current zoom level.

  Returns undefined | number

  The map's current zoom level (0-24).

locate

• locate(opt, events?): Locate

• Parameters

  • opt: LocateOptions
  • Optionalevents: LocationEvents

  Returns Locate

mapStateWithFunc

• mapStateWithFunc(func): Record<string, any>

• Parameters

  • func: ((x: any) => any)
    • • (x): any

      • Parameters

        • x: any

        Returns any

  Returns Record<string, any>

onLoad

• onLoad(event?): Promise<WebMapMain<M, E, O>>

• helper method to wait for events to load. By default, card creation is tracked

  Parameters

  • event: keyof WebMapEvents = 'create'

    The name of the event whose status is checked

  Returns Promise<WebMapMain<M, E, O>>

  Example

  var webMap = new WebMap(options);
  webMap.onLoad().then(function () {
    webMap.getEventStatus('create'); // true
  })
  
  // use async/await syntax
  async function () {
    await webMap.onLoad();
    doSomething();
  }
  
  Copy

onMapLoad

• onMapLoad(cb?): Promise<MapAdapter<any, any, any>>

• Parameters

  • Optionalcb: ((mapAdapter: MapAdapter<any, any, any>) => void)
    • • (mapAdapter): void

      • Parameters

        • mapAdapter: MapAdapter<any, any, any>

        Returns void

  Returns Promise<MapAdapter<any, any, any>>

setCenter

• setCenter(lngLat): this

• Set the center of the current view.

  Parameters

  • lngLat: LngLatArray

    Array of two numbers representing longitude and latitude of the center of the map view.

  Returns this

  Example

  // Mount Everest 27° 59′ 17″ N, 86° 55′ 31″ E
  webMap.setCenter([86.925278, 27.988056]);
  Copy

setCursor

• setCursor(cursor): void

• Set the cursor icon to be displayed when hover icon on the map container.

  Parameters

  • cursor: Cursor

    Available cursor name from https://developer.mozilla.org/ru/docs/Web/CSS/cursor

  Returns void

setRuntimeParams

• setRuntimeParams(params): void

• Parameters

  • params: RuntimeParams<Params, string>

  Returns void

setView

• setView(lngLatOr, zoom?): void

• Sets the view of the map geographical center and zoom

  Parameters

  • lngLatOr: LngLatArray
  • Optionalzoom: number

    The zoom level to set (0-24).

  Returns void

  Example

  // Mount Everest 27° 59′ 17″ N, 86° 55′ 31″ E
  webMap.setView([86.925278, 27.988056], 12)
  Copy

• setView(options): void

• Parameters

  • options: ViewOptions

  Returns void

setZoom

• setZoom(zoom): this

• Zoom to a specific zoom level.

  Parameters

  • zoom: number

    The zoom level to set (0-24).

  Returns this

stopGetCoordFromMapClick

• stopGetCoordFromMapClick(): void

• Returns void

zoomIn

• zoomIn(): void

• Returns void

zoomOut

• zoomOut(): void

• Returns void