Class MapView

Camera

Labels

Markers

Navigation

Outdoor

Paths

Style

currentFloor

• get currentFloor(): Floor

• The current floor (Floor) of the map.

  Returns Floor

createCoordinate

• createCoordinate(latitude, longitude, floor?): Coordinate

• Creates a Coordinate on the map.

  Parameters

  • latitude: number

    The latitude of the coordinate.
  • longitude: number

    The longitude of the coordinate.
  • Optionalfloor: Floor

    Optional floor information if applicable.

  Returns Coordinate

  The created coordinate object.

  Example

  // Create a coordinate at the CN Tower.
  const coord = map.createCoordinate(43.642567, -79.387054);
  Copy

createCoordinateFromScreenCoordinate

• createCoordinateFromScreenCoordinate(x, y, floor?): undefined | Coordinate

• Parameters

  • x: number
  • y: number
  • Optionalfloor: Floor

  Returns undefined | Coordinate

destroy

• destroy(): void

• Destroys the MapView.

  Returns void

expand

• expand(opts?): undefined | Promise<void>
• Experimental

  Parameters

  • Optionalopts: {
        excludeFloors: Floor[];
    }

    • excludeFloors: Floor[]

  Returns undefined | Promise<void>

getDirections

• getDirections(from, to, options?): undefined | Directions

• Retrieves directions (Directions) from one navigable point (TNavigationTarget) to another on the map.

  Parameters

  • from: TNavigationTarget | TNavigationTarget[]

    The starting point for navigation.
  • to: TNavigationTarget | TNavigationTarget[]

    The destination point.
  • Optionaloptions: TGetDirectionsOptions

    Optional parameters for getting directions.

  Returns undefined | Directions

  Directions from the start to the destination point.

  Example

  const directions = await map.getDirections(space1, space2);
  Copy

getHoverColor

• getHoverColor(): undefined | string

• Returns undefined | string

getMapData

• getMapData(): {}

• Returns {}

getState

• getState<T>(target): undefined | TGetState<T>

• Type Parameters

  • T extends
        | string
        | Space
        | MapObject
        | Label
        | Marker

  Parameters

  • target: T

  Returns undefined | TGetState<T>

off

• off<EventName>(eventName, fn): void

• Unsubscribe a function previously subscribed with on

  Type Parameters

  • EventName extends
        | "hover"
        | "click"
        | "camera-change"
        | "outdoor-view-loaded"
        | "outdoor-style-loaded"
        | "user-interaction-start"
        | "user-interaction-end"
        | "floor-change-start"
        | "floor-change"
        | (keyof TStackedMapsEvents)

  Parameters

  • eventName: EventName

    An event name to which the provided function was previously subscribed.
  • fn: ((payload: TEventPayload<EventName>) => void)

    A function that was previously passed to on. The function must have the same reference as the function that was subscribed.

    • • (payload): void

      • Parameters

        • payload: TEventPayload<EventName>

        Returns void

  Returns void

  Example

  // Unsubscribe from the 'click' event
  const handler = (event) => {
   const { coordinate } = event;
   const { latitude, longitude } = coordinate;
  	console.log(`Map was clicked at ${latitude}, ${longitude}`);
  };
  mapView.off('click', handler);
  Copy

on

• on<EventName>(eventName, fn): void

• Subscribe a function to an event.

  Type Parameters

  • EventName extends
        | "hover"
        | "click"
        | "camera-change"
        | "outdoor-view-loaded"
        | "outdoor-style-loaded"
        | "user-interaction-start"
        | "user-interaction-end"
        | "floor-change-start"
        | "floor-change"
        | (keyof TStackedMapsEvents)

  Parameters

  • eventName: EventName

    An event name which, when fired, will call the provided function.
  • fn: ((payload: TEventPayload<EventName>) => void)

    A callback that gets called when the corresponding event is fired. The callback will get passed an argument with a type that's one of event payloads.

    • • (payload): void

      • Parameters

        • payload: TEventPayload<EventName>

        Returns void

  Returns void

  Example

  // Subscribe to the 'click' event
  const handler = (event) => {
   const { coordinate } = event;
   const { latitude, longitude } = coordinate;
  	console.log(`Map was clicked at ${latitude}, ${longitude}`);
  };
  mapView.on('click', handler);
  Copy

setFloor

• setFloor(floor): void

• Sets the current floor (Floor) of the map.

  Parameters

  • floor: string | Floor

    The floor or floor ID to set.

  Returns void

setHoverColor

• setHoverColor(c): void

• Parameters

  • c: string

  Returns void

update

• update(): void

• Returns void

updateState

• updateState<T>(target, state): void

• Updates the state (TUpdateState) of a given target on the map.

  The following table maps targets to states.

  target	state
  Label	TLabelState
  MapObject	TGeometryState
  Space	TGeometryState

  Type Parameters

  • T extends
        | string
        | Space
        | MapObject
        | Label
        | Marker

  Parameters

  • target: T

    The target to update.
  • state: TUpdateState<T>

    The new state to apply to the target.

  Returns void

  Example

  // Update the color of a space to red.
  map.updateState(space, { color: 'red' });
  Copy