Mappls Nearby Widget React Native¶

Getting started¶

The Mappls Nearby Widget makes it easy to integrate the functionality to search nearby POIs for selected categories in your React Native application. The Nearby Search widget provided as a means to enable radially search for Nearby Places on Mappls Maps.

The widget offers the following basic functionalities:

Ability to search for nearby places directly with Mappls Maps visual interface.
A single method to initiate nearby search across all categories of places available on Mappls.
Ability to get information from Mappls Nearby Search widget through a callback.

Version History ¶

Version	Last Updated	Author	Release Note
v2.0.0	06 Oct, 2025	Mappls API Team (MA) (ST)	- Authentication and authorization mechanisms have been revised. - Updated minimum Android version to 21. - Added Support for 16 KB Page Sizes - Added SPM(Swift Package Manager Support) for IOS.

Installation¶

First install mappls-nearby-widget-react-native:

npm install mappls-nearby-widget-react-native

Install peerDependencies

npm install mappls-map-react-native

Android Setup¶

Click Here for Android Setup

IOS Setup¶

Click Here for IOS Setup
On iOS it's necessary to add $MAPPLS_NEARBY_WIDGETS.post_install(installer) to the post_install block in the ios/Podfile is necessary:

     post_install do |installer|
     # Other post install hooks...
     + $MAPPLS_NEARBY_WIDGETS.post_install(installer)
     end

Usage¶

Import¶

import MapplsNearbyWidget from "mappls-nearby-widget-react-native";

Open MapplsNearbyWidget¶

try {
  const  data = await MapplsNearbyWidget.openNearbyWidget({});
  console.log(JSON.stringify(data));
  } catch (e) {
 //error log
  }

Request Props¶

nearbyOptions(Object): You can use nearbyOptions to set the following properties:
radius(number): provides the range of distance to search over(default: 1000, min: 500, max: 10000)
sortBy(Enum): provides configured sorting operations for the client on cloud.Below are the available sorts:
NearbyCriteria.DISTANCE_ASCENDING
NearbyCriteria.DISTANCE_DESCENDING will sort the data on distance basis.
NearbyCriteria.NAME_ASCENDING
NearbyCriteria.NAME_DESCENDING will sort the data on alphabetically basis.
searchBy(Enum): provides configurable search operations for the client on cloud. Below are the available sorts:
NearbyCriteria.DISTANCE
NearbyCriteria.IMPORTANCE - will search data in order of prominence of the place.
bounds(String): Allows the developer to send in map bounds to provide a nearby search within the bounds.
{e.g. (bounds(“28.56812,77.240519;28.532790,77.290854”))
pod(Enum): it takes in the place type code which helps in restricting the results to certain chosen type. Access to this parameter is controlled from the backend. This parameter if provided will override any values provided in keywords request param.
Below mentioned are the codes for the pod
- NearbyCriteria.POD_SUB_LOCALITY
- NearbyCriteria.POD_LOCALITY
- NearbyCriteria.POD_CITY
- NearbyCriteria.POD_STATE
filter(String): This parameter helps you get a specific type of EV charging Station
- filter = model:(string);brandId:(string);plugType:(string)
richData(Boolean): Rich Data related to POI
userName(String): Use to set the user name
categoryCodes(Array[Object]): You can set array of categoryCodes with following parameters:
category (String): Name of the category that display on a view
icon(image): To show icon of category, example:- icon:Image.resolveAssetSource(require('./coffee.png'))
categoryCode (Array<String>): List of category codes
markerIcon (image): Marker icon to display on a map , example:- icon:Image.resolveAssetSource(require('./marker.png'))