Skip to main content
Version: 6.0

Views

Mappedin SDK for React Native version 6 is currently in an alpha state while Mappedin perfects new features and APIs. Open the v6 release notes to view the latest changes.
Using Mappedin SDK for React Native with your own map requires a Pro license. Try a demo map for free or refer to the Pricing page for more information.

A view is a copy of a map that allows a map editor to toggle the visibility of a layer or individual items in a layer on and off and choose a map theme. It is similarly named but should not be confused with the MapView class, which is used to show a map.

Views allow the same map to be used for many use cases, such as:

  • Public use for wayfinding
  • Use one of many light or dark themes
  • With safety annotations for safety and security personnel
  • Showing private areas for maintenance and custodial staff
  • Displaying only the floor plan for leasing prospects
  • Highlighting delivery doors for delivery drivers
  • and many more...

Get a View ID​

A viewId is used by Mappedin JS to download specific view. To get a viewId:

  1. Log into the Mappedin Editor.
  2. Click on the Developers tab.
  3. Select the desired map from the map drop down.
  4. Select the desired view from the view drop down.
  5. The viewId will be shown in the code snippet on the page.

Display a View​

To display a specific view of a map, specify the viewId of the view using the Mappedin.TGetMapDataSharedOptions object that is a property of MapViewProps used by MapView component.

<MapView
  mapData={{
    key: KEY,
    secret: SECRET,
    mapId: MAP_ID,
    viewId: VIEW_ID,
  }}
  options={{}}
>
</MapView>

View Example​

The following example demonstrates how an app could display and switch between multiple views. Use the drop down menu to switch between the available views.