Options
All
  • Public
  • Public/Protected
  • All
Menu

Hierarchy

Index

Constructors

constructor

  • Parameters

    Returns MapView

Properties

BlueDot

BlueDot: BlueDotLayer

Camera

Camera: Camera

Journey

Journey: JourneyLayer

Optional currentPath

currentPath: MappedinNode[]

options

options: TMapViewOptions = {}

Accessors

container

  • get container(): HTMLElement
  • The div MapView is using.

    property

    container {Div}

    final

    Returns HTMLElement

currentMap

state

venue

  • The Venue data this MapView is using.

    property

    venue {MappedinVenue}

    final

    Returns Mappedin

Methods

addInteractivePolygon

  • addInteractivePolygon(polygonOrPolygonId: string | MappedinPolygon): void
  • Makes a single Polygon hoverable/clickable. Polygons you haven't called this on will be treated as non-interactive and not respond to any mouse events.

    Parameters

    Returns void

addInteractivePolygonsForAllLocations

  • addInteractivePolygonsForAllLocations(options?: { excludeTypes?: string[]; locations?: MappedinLocation[] }): void
  • Makes all polygons attached to a location hoverable/clickable. Polygons you haven't called this on will be treated as non-interactive This is a convenience function for calling MapView.addInteractivePolygon on all the polygons attached to all locations. You may also make individual polygons interactive with the addInteractivePolygon method instead of, or in addition to this method.

    Parameters

    • Optional options: { excludeTypes?: string[]; locations?: MappedinLocation[] }
      • Optional excludeTypes?: string[]

        A list of Location types to skip. All locations of this type will be exluded from becoming interactive

      • Optional locations?: MappedinLocation[]

        An array of Location objects. Overrides the default of making all locations interactive, and instead applies to only the locations specified here.

    Returns void

clearAllPolygonColors

  • clearAllPolygonColors(): void
  • Resets ALL Polygons you have changed with MapView.setPolygonColor back to their original color. The hover effect will still be present if the user is currently hovering over a Polygon.

    Returns void

clearPolygonColor

  • Resets a Polygon back to it's original color. If the user is hovering over a polygon, it will still have the hover effect.

    Parameters

    • polygonOrPolygonId: string | MappedinPolygon

      The Polygon/Polygon ID to reset.

    Returns void

createMarker

createThreeJSMarker

  • Add a ThreeJS object to the screen to be rendered on the marker layer.

    Parameters

    Returns ThreeJSMarkerHandle

createTooltip

  • This creates a tooltip that allows you to pass dynamic content which will attempt to position around an anchor in 3D space. The tooltip will be positioned based on one of four AnchorTypes (top, bottom, left, right).

    options.defaultAnchorType and options.enabledAnchorTypes should be one of the constants from Mappedin.Tooltip.ANCHOR

    options.defaultAnchorType will override options.enabledAnchorTypes if that anchor was disabled it will be automatically re-enabled

    Parameters

    Returns SmartTooltip

    The Tooltip you created, which has already been added to the scene.

destroy

  • destroy(): void
  • Destroy instance and clean up memory

    Returns void

disableImageFlippingForAllPolygons

  • disableImageFlippingForAllPolygons(): void
  • Returns void

drawPath

  • Draws an entire path. It takes a list of Nodes and will break them into separate pathSegments on every map change, putting the resultant segment on the right Map.

    Parameters

    Returns string

    An array of pathSegment ids.

enableImageFlippingForAllLocations

  • enableImageFlippingForAllLocations(options?: { excludeTypes?: string[]; locations?: string[] | MappedinLocation[] }): void
  • Let any image attached to a Polygon attached to a Location flip 180 degrees with the camera so it's always upright.

    method

    enableImageFlippingForAllLocations

    Parameters

    • Optional options: { excludeTypes?: string[]; locations?: string[] | MappedinLocation[] }
      • Optional excludeTypes?: string[]

        A list of Location types to skip, if for some reason there are Locations that have logos that shouldn't flip.

      • Optional locations?: string[] | MappedinLocation[]

        An array of Location objects, or Location IDs. If excludeTypes is not sufficient you can explicitly set the Locations you are marking to flip. You can also call MapView.enableImageFlippingForPolygon manually for every polygon you care about instead.

    Returns void

enableImageFlippingForPolygon

  • enableImageFlippingForPolygon(options: { polygonId: string; rotation?: number }): void
  • Mark a specific Polygon so, if it has an image, it rotates with the camera.

    Parameters

    • options: { polygonId: string; rotation?: number }
      • polygonId: string

        The ID of the Polygon who's image (if any) should rotate.

      • Optional rotation?: number

        The how much the image has been rotated so that it's "up". Determined from the Polygon object itself typically, but can be set manually if needed.

    Returns void

getNearestNodeByScreenCoordinates

  • Get Nearest Node to a screen coordinate x, y, map. Useful for doing directions from any place on the map

    Parameters

    • x: number
    • y: number
    • Optional mapOrMapId: string | MappedinMap

      Map of MapId

    Returns MappedinNode

getPrimaryLocationForPolygon

  • Finds the main Location associated with a Polygon. This means a Location attached to the Polygon that has no parents, or, if there are none of those, a Location nearest the top of some hierarchy that does have the Polygon attached.

    This means if there are multiple hierarchies of Locations attached to the Polygon, the one that gets returned is not guaranteed to be what you want.

    Parameters

    Returns MappedinLocation

labelAllLocations

labelPolygon

  • Labels a specific Polygon using a floating 2D label that remains the same size regardless of zoom

    Parameters

    Returns FloatingLabel

  • Labels a specific Polygon (or area of 3D space) with a TextLabel that lives in 3D space. That means it will be smaller when the camera is further away, and the angle you see it at will change with the camera. The text will flip 180 degrees when the camera rotates so it's never totally upside-down.

    It also sets the hover label (in 2D and 3D). Many of these options do nothing in 2D, as TextLabels are not supported, but it won't break anything.

    You must provide text, and either a Polygon, or a canvasBounds and height

    Parameters

    Returns TFlatLabel

off

  • off<EVENT_NAME>(eventName: EVENT_NAME, fn: (payload: E_SDK_EVENT_PAYLOAD[EVENT_NAME]) => void): void

on

openAllPolygons

  • openAllPolygons(): void
  • As the name suggests, all polygons will have their "closed" state set to "opened".

    Returns void

removeAllInteractivePolygons

  • removeAllInteractivePolygons(): void
  • Remove all interactive polygons

    Returns void

removeAllLabels

  • removeAllLabels(): void
  • Removes all labels from all Maps.

    Returns void

removeAllMarkers

  • removeAllMarkers(): void
  • Removes all Markers (from all Maps, not just the current one).

    Returns void

removeAllPaths

  • removeAllPaths(): void
  • Removes all pathSegments from all Maps.

    Returns void

removeAllThreeJSMarkers

  • removeAllThreeJSMarkers(): void
  • Remove all ThreeJS marker from the scene.

    Returns void

removeAllTooltips

  • removeAllTooltips(): void
  • Remove all tooltips

    Returns void

removeInteractivePolygon

  • removeInteractivePolygon(polygonOrPolygonId: string | MappedinPolygon): void
  • Makes a polygon no longer hoverable/clickable.

    Parameters

    • polygonOrPolygonId: string | MappedinPolygon

      The previously interactive Polygon/Polygon ID to make non-interactive.

    Returns void

removeMarker

  • removeMarker(markerOrMarkerId: string | Marker): void
  • Remove Marker

    Parameters

    • markerOrMarkerId: string | Marker

    Returns void

removePath

  • removePath(pathId: string): void
  • Remove a path by id

    Parameters

    • pathId: string

    Returns void

removeThreeJSMarker

  • removeThreeJSMarker(markerHandle: ThreeJSMarkerHandle): boolean
  • Remove a ThreeJS marker from the scene. This will be a no-op if the map object associated with the marker has been destroyed.

    Parameters

    • markerHandle: ThreeJSMarkerHandle

      marker to remove

    Returns boolean

    true if the marker was removed, false if the marker or its map had already been removed

removeTooltip

  • removeTooltip(tooltipOrTooltipId: string | SmartTooltip): void
  • Removes a {@link Tooltip} you have added previously.

    Parameters

    • tooltipOrTooltipId: string | SmartTooltip

      A Tooltip that has previously been returned from MapView.createTooltip.

    Returns void

setBackgroundColor

  • setBackgroundColor(color: string | number, alpha?: number): void
  • Sets the clear color of the Map something else, it you want it to fit it more with your website. Otherwise the div will be white where there is no Map visible.

    Parameters

    • color: string | number

      The color to use. Not an HTML color name.

    • Optional alpha: number

      Opacity between 0 and 1.

    Returns void

setHoverColor

  • setHoverColor(color: string | number): void
  • Sets the color for hovering over polygons

    Parameters

    • color: string | number

    Returns void

setMap

  • setMap(mapOrMapId: string | MappedinMap): Promise<null>
  • Change the currently displayed Map to a new one.

    method

    setMap

    Parameters

    • mapOrMapId: string | MappedinMap

      The Map ID or Map Object to change the Map to.

    Returns Promise<null>

setPolygonColor

  • setPolygonColor(polygonOrPolygonId: string | MappedinPolygon, color: string, textColor?: string, opacity?: number): void
  • Given a polygon/polygon id, set it to a specific color, and set any text label associated with that polygon to another color.

    Parameters

    • polygonOrPolygonId: string | MappedinPolygon

      The Polygon/Polygon ID to change the color of.

    • color: string

      The color to use.

    • Optional textColor: string
    • Optional opacity: number

    Returns void

setState

  • setState(state: STATE): void
  • Unsubscribe from SDK events

    Parameters

    Returns void

tryRendering

  • tryRendering(renderMode?: any): void
  • The scene only renders when something has changed. This should be something a 3rd party developer doesn't need to worry about, but if you are doing something weird, or have your own special tween for something, you will want to call this function. You can call it as often as you want, it just sets a flag that we need to render again, and renders a few frames if we weren't already doing that. Ignored in 2D.

    Parameters

    • Optional renderMode: any

    Returns void

updateClosedStateForPolygon

  • updateClosedStateForPolygon(options: { closed: boolean; open?: boolean; polygon: string | MappedinPolygon }): void
  • A polygon can have state that renders the concept of being "closed", which is a generic blanket term that can be used in general to inform the user that they can expect this polygon to not be servicing customers.

    Parameters

    • options: { closed: boolean; open?: boolean; polygon: string | MappedinPolygon }
      • closed: boolean

        If true, the polygon will be marked as being closed. If false, the polygon will be marked as being open.

      • Optional open?: boolean

        If true, a convenience parameter that is the converse of options.closed. Note that if both are present, closed will receive higher precedence.

      • polygon: string | MappedinPolygon

        The polygon or polygon id whose state is being updated.

    Returns void