LocusMaps Online Intro

by | Aug 21, 2019 | Mapping & Location Tech

The image above is a to-scale, bird’s eye-view of Los Angeles International Airport rendered in a browser using the LocusLabs JavaScript SDK. Compiled using our advanced mapping technology and venue management system, it not only captures detailed spatial geometry, but also venue metadata such as Points of Interest and Routing options. At the end of this post, we provide a few code snippets to show just how easy it is to use our SDK to perform actions such as showing a Point of Interest, finding directions or performing a search.

Map Detail

 

Zooming in on Terminal 7 shows some of the rich detail captured by the maps, including:

Points of Interest

  • Gates
  • Shops
  • Restaurants
  • Restrooms
  • Amenities like charging stations, defibrillators, water fountains, nursing rooms and more.

Geometry

  • Basic layout
  • Thoroughfares like stairs, elevators, escalators, walkways, passages and more.

These details are available for every floor of every building for a venue.

Widgets

In addition to the basic map display, LocusMaps Online provides a variety of built-in widgets to enable users to easily change the building or floor, perform searches, view Point of Interest details or find directions between any two Points of Interest, for example an arrival gate and the baggage counter or the check-in desk and a restaurant or lounge.

The Levels Widget

As a venue can have numerous buildings with a number of different floors, the levels widget provides an easy way to navigate between them. The following video shows the ease of which the floor can be changed and how the map dynamically adapts to layout changes:

Changing the floor with the Levels Widget

The Search Widget

The powerful search widget, demonstrated in the video below, allows a user to:

  • Instantly see the locations of categorized Points of Interest like shops, restaurants, airlines and more.
  • Search using any keyword and choose from a list of generic or specific suggestions, the locations of which are indicated on the map.

The Point of Interest Widget

Clicking on a result in the Search Widget zooms the map to the selected result and opens the detailed Point of Interest Widget, which contains the following information:

  • Images
  • Name & Overview
  • Location (building, floor, pre/post security)
  • Keywords
  • Website Link (clickable)
  • Directions

The Directions Widget

Getting clear and easy-to-follow directions between any two points in a venue is a breeze with the Directions Widget. Once start and end points have been entered, the route is shown on the map and a step-by-step interface provided to guide the user along the way. The video below shows how getting to your gate has never been easier.

Code Samples

Our Javascript SDK is incredibly easy to use and with just a few lines of code, our powerful and feature-rich maps are at your disposal. The sections below show how perform some of the most common tasks with our SDK.

Showing the map

Showing the map requires only 2 lines of HTML. The fiddle below shows how easy it is to load a map:

Showing a Point of Interest

Showing detailed information like photos, location, etc. for a Point of Interest (POI) requires only a single Javascript command. The map will even automatically pan to and zoom in on the POI. Once a POI is showing, a user can also easily get directions from it to any other POI. In this case, we are going to show the Starbucks close to Gate 60:

Showing Directions

Showing directions between any two Points of Interest requires only a single Javascript command. The fiddle below shows how to show directions from the American Flagship Lounge in Terminal 5 to Gate 53A in terminal 5. The displayed navigation interface provides the user with easy step-by-step instructions how to reach their destination.

Showing Search Results

A simple Javascript command can toggle the Search Widget to display the results for a passed-in search term. Helpfully, the map will also highlight the locations of all results on the current level and indicate result counts on other levels not shown. The fiddle below shows the result of searching for “Lounge”:

Conclusion

We also offer a wide range of other features and functionality in addition to the ones shown above and will be covered in a future post.

In addition to our Javascript SDK, we also offer an iOS SDK and an Android SDK which can be integrated into your apps to provide a highly customized and feature-rich mapping experience to your customers.

Get in touch

Liked what you saw? Have questions? Want to know more?

We’d love to hear from you