Mappls Nearby Widget-React Native

Getting started

npm install mappls-nearby-widget-react-native

Install peerDependencies

npm i mappls-map-react-native

If using React-native<0.60

react-native link mappls-nearby-widget-react-native

Installation

Android

Add followling line in android/build.gradle file:-

allprojects {
   repositories {
            mavenLocal()
            maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
           url("$rootDir/../node_modules/react-native/android")
            }
           maven {
 // Android JSC is installed from npm
    url("$rootDir/../node_modules/jsc-android/dist")
          }

  
+       maven { url 'https://maven.mappls.com/repository/mappls/'}

           google()
           jcenter()
           maven { url 'https://www.jitpack.io' }

         }

}

Add followling line in android/app/build.gradle file:-

defaultConfig {

applicationId "com.example"

minSdkVersion rootProject.ext.minSdkVersion

targetSdkVersion rootProject.ext.targetSdkVersion

versionCode 1

versionName "1.0"

+ multiDexEnabled true

}
+ dataBinding {
+    enabled true
+   }

ios

run pod install from ios folder

Usage

Step 1: Import

import MapmyindiaNearbyWidget from "mappls-nearby-widget-react-native";
import  MapmyIndiaGL  from  'mappls-map-react-native';

Step 2. Initialization

Initialize the SDK with your keys.

// for map sdk
MapplsGL.setMapSDKKey(mapSDKKey);//place your mapsdkKey
MapplsGL.setRestAPIKey(restAPIKey);//your restApiKey
MapplsGL.setAtlasClientId(atlasClientId);//your atlasClientId key
MapplsGL.setAtlasClientSecret(atlasClientSecret); //your atlasClientSecret key
MapplsGL.setAtlasGrantType(atlasGrantType);

Step 3: 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