Building high-quality, cost-effective apps in Southeast Asia with Amazon Location Service

Amazon Location Service is a fully-managed service that makes it easy for you to add location data and functionality such as maps, search, and routing to your applications. With Amazon Location Service, you can access high-quality data from multiple data providers, giving you the flexibility to choose the provider with the best data for your project. This eliminates the need for third-party contracts or integrations, allowing you to focus on building your application without having to manage additional accounts, credentials, licenses, and billing. Today, I am excited to announce that you can now build high-quality, cost-effective applications in Southeast Asia with GrabMaps as a new data provider for Amazon Location Service.

Introducing GrabMaps

Grab initially relied on third-party map providers to support their operational team in planning and executing deliveries. However, they soon realized that the global map providers were unable to keep up with the frequent changes and specific needs of the Southeast Asian region. So they started to build GrabMaps in 2017.

GrabMaps has since grown to power Grab’s flagship product, the Grab Superapp, a one-stop shop for food, grocery, and package delivery, as well as ride sharing services in Southeast Asia. GrabMaps takes a unique approach to capturing data that takes local characteristics into account, such as the presence of small alleyways and subdivisions, vehicle restrictions by license plate, and transportation modes specific to Southeast Asia. It employs a community-based mapping strategy that leverages Grab’s consumers, merchants, and fleets of driver and delivery partners. GrabMaps receives, analyzes, and validates daily updates from millions of orders and rides, with real-time feedback from partners on road closures, business address changes, and more. Driver and delivery partners are also incentivized to contribute location information such as points of interest (POIs), street imagery, street names, and the location of traffic signs. This allows GrabMaps to offer high-quality regional mapping data in terms of accuracy, coverage, and freshness.

GrabMaps data is now available through Amazon Location Service in the AWS Asia Pacific (Singapore) Region.

Develop cost-effective solutions for your business

Amazon Location Service offers competitive pricing, especially when it comes to operations such as geocoding and route calculations. Amazon Location Service’s route calculations are up to 10 times cheaper than competitors, offering advanced routing features like motorcycle routing and traffic estimation at no additional cost. Geocoding and reverse geocoding with Amazon Location Service are also up to 10 times cheaper than competitors, and they offer a “stored geocode” option that allows you to purchase the right to store and reuse geocoded data indefinitely. This can be particularly cost-effective for use cases with a high percentage of recurring addresses.
Amazon Location Service’s map tiles are also competitively priced, and in many cases, their per-tile pricing is cheaper than competitors’ session-based pricing.

Access high-quality data in Southeast Asia

You can now use Amazon Location Service’s Maps, Places, and Routes APIs in the AWS Asia Pacific (Singapore) Region to access GrabMaps data, covering several countries in Southeast Asia, including Singapore, Cambodia, Vietnam, Philippines, Indonesia, Malaysia, Myanmar, and Thailand. Amazon Location Service’s Maps API offers two map styles designed by GrabMaps: Street Light and Street Dark. They are both general-purpose map styles with detailed land use layers, area names, roads, and points of interests, professionally designed to support different applications and use cases. Amazon Location Service’s Places API, powered by GrabMaps data, gives you access to over 50M addresses and POIs across Southeast Asia. The API allows you to add geocoding, reverse-geocoding, and autocomplete functionality to your applications, enabling end-users to search for places and convert geographic coordinates into addresses and vice versa. Finally, Amazon Location Service’s Routes API uses GrabMaps’ up-to-date road network and traffic information to provide the fastest route using a variety of parameters, such as both general and local transportation modes (car, walking, motorcycle, and bicycle), departure time, and avoidances (ferries, tolls, and highways). This allows you to add route planning and optimization capabilities to your applications, helping end-users make more efficient and informed travel decisions.

In the following sections, you will learn how to set up Amazon Location Service resources with GrabMaps as the data provider and use them in a web application. If you prefer a visual explanation, watch the following video tutorial.

Solution overview

You will create the necessary AWS resources using AWS CloudFormation, and configure and deploy a web application using the amplify-ui-geo-explore project available from the Amazon Location Service’s GitHub repository.

The application will have the following components and functionalities:

An interactive map
A location search widget that allows you to search for addresses and place names
A route calculator that finds the fastest route using a number of parameters such as different transportation modes, departure time, and avoidances
Tracking and geofencing functionality that allows you to create polygon boundaries as geofences, simulate location tacking, and evaluate location updates against geofences and trigger enter/exit events

Figure 1. A web application with an interactive map, location search, and routing functionalities

Walkthrough

Prerequisites

To complete this walkthrough, you will need access to an AWS account with sufficient permissions to create AWS resources. Create an AWS account if you do not have one already.

Create AWS resources

You will use an AWS CloudFormation template to create a number of AWS resources, including Amazon Location Service’s map, place index, and route calculator resources with GrabMaps as the data provider. The template will also create Amazon Location Service’s geofence and tracking resources, which are necessary for the application to run. Additionally, it will create an Amazon Cognito Identity Pool, and several IAM roles and policies to grant the application the necessary permissions to access Amazon Location Service’s resources, while maintaining control over who has access to these resources and what actions they can perform.

Click this link to deploy this template into your AWS account. It will open the AWS Management Console and initiate the CloudFormation template deployment process. Check the I acknowledge that AWS CloudFormation might create IAM resources box (Figure 2); then select the Create stack button.

Figure 2. Deploy the CloudFormation template to your AWS account using the AWS CloudFormation console.

Once the deployment process is complete, go to the Outputs section to get the Cognito Identity Pool ID and the names of the Amazon Location Service resources that were created (Figure 3).

Figure 3. Access the CloudFormation stack outputs in the AWS CloudFormation console.

Configure and launch the application

Clone the amplify-ui-geo-explore project available from the Amazon Location Service’s GitHub repository. Then, navigate to the project directory and install dependencies.

git clone https://github.com/aws-samples/amazon-location-samples.git
cd amazon-location-samples/amplify-ui-geo-explore/
npm install

Next, open src/configuration.js and use the CloudFormation stack outputs to enter your Cognito Identity Pool ID and the names of your Amazon Location Service resources. Use ap-southeast-1 as the AWS Region, VectorGrabStandardLight as the map style, and Vehicle-1 as the device name.

export const IDENTITY_POOL_ID = "ap-southeast-1:...";
export const REGION = "ap-southeast-1";
export const MAP = {
  NAME: "GrabDemoMap",
  STYLE: "VectorGrabStandardLight",
};
export const PLACE = "GrabDemoPlaceIndex";
export const ROUTE = "GrabDemoRouteCalculator";
export const GEOFENCE = "GrabDemoGeofenceCollection";
export const TRACKER = "GrabDemoTrackers";
export const TRACKER_SIMULATED_DEVICE = "Vehicle-1";

Finally, open src/App.jsx and modify the MapView component to set the initial map view (initialViewState) to Kuala Lumpur, Malaysia. Use 101.656125 for the longitude and 3.1506347 for the latitude.

<MapView
          ...
          initialViewState={{
            longitude: 101.656125,
            latitude: 3.1506347,
            zoom: 11,
          }}
          ...
        >
...
</MapView>

Save your project and run the following command to run the application.

npm start

If you go to http://localhost:8080/ in your browser, you will see an interactive map, with location search and routing functionality, powered by GrabMaps data (Figure 4).

Figure 4. A web application with an interactive map, location search, and routing functionalities.

Clean up

If you would like to remove all of the resources created in this walkthrough, delete the CloudFormation stack called AmazonLocationServiceGrabDemo (Figure 5).

Figure 5. Use the AWS CloudFormation console to delete all the resources created in this walkthrough.

Conclusion

Amazon Location Service has added GrabMaps as a new data provider for AWS customers in Southeast Asia. This allows you to use high-quality data from GrabMaps to add location data and functionality to your applications. In this post, you learned how to use Amazon Location Service’s Maps, Places, and Routes APIs to add interactive maps, location search, and routing functionality to a web application, with high-quality data from GrabMaps.

There are several sample projects on Amazon Location Service’s GitHub repository that you can explore to learn how to build applications with location data and functionality on AWS. Visit Amazon Location Service’s product page to learn about the offerings, common use cases, and customer success stories. To dive deeper into Amazon Location Service’s features, visit the developer documentation.

About the author:

Front-End Web & Mobile