Giter VIP home page Giter VIP logo

react-native-geocoder's Introduction

react-native-geocoder

CircleCI

geocoding services for react native

Install

npm install --save react-native-geocoder

iOS

  1. In the XCode's "Project navigator", right click on Libraries folder under your project โžœ Add Files to <...>
  2. Go to node_modules โžœ react-native-geocoder and add ios/RNGeocoder.xcodeproj file
  3. Add libRNGeocoder.a to "Build Phases" -> "Link Binary With Libraries"

Android

  1. In android/setting.gradle
...
include ':react-native-geocoder', ':app'
project(':react-native-geocoder').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-geocoder/android')
  1. In android/app/build.gradle
...
dependencies {
    ...
    compile project(':react-native-geocoder')
}
  1. register module (in MainActivity.java)
import com.devfd.RNGeocoder.RNGeocoderPackage; // <--- import

public class MainActivity extends ReactActivity {
  ......

  @Override
  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
            new RNGeocoderPackage()); // <------ add this
  }

  ......

}

Usage

import Geocoder from 'react-native-geocoder';

// Position Geocoding
var NY = {
  lat: 40.7809261,
  lng: -73.9637594
};

Geocoder.geocodePosition(NY).then(res => {
    // res is an Array of geocoding object (see below)
})
.catch(err => console.log(err))

// Address Geocoding
Geocoder.geocodeAddress('New York').then(res => {
    // res is an Array of geocoding object (see below)
})
.catch(err => console.log(err))

Fallback to google maps geocoding

Geocoding services might not be included in some Android devices (Kindle, some 4.1 devices, non-google devices). For those special cases the lib can fallback to the online google maps geocoding service

import Geocoder from 'react-native-geocoder';
// simply add your google key
Geocoder.fallbackToGoogle(MY_KEY);

// use the lib as usual
let ret = await Geocoder.geocodePosition({lat, lng})
// you get the same results

With async / await

try {

    const res = await Geocoder.geocodePosition(NY);
    ...

    const res = await Geocoder.geocodeAddress('London');
    ...
}
catch(err) {
    console.log(err);
}

Geocoding object format

both iOS and Android will return the following object:

{
    position: {lat, lng},
    formattedAddress: String, // the full address
    feature: String | null, // ex Yosemite Park, Eiffel Tower
    streetNumber: String | null,
    streetName: String | null,
    postalCode: String | null,
    locality: String | null, // city name
    country: String, 
    countryCode: String
    adminArea: String | null
    subAdminArea: String | null,
    subLocality: String | null
}

Notes

iOS

iOS does not allow sending multiple geocoding requests simultaneously, unless you enable the fallbackToGoogle to handle the parallel calls when an native iOS request is active.

Android

geocoding may not work on older android devices (4.1) and will not work if Google play services are not available.

react-native-geocoder's People

Contributors

danielweinmann avatar devfd avatar mikelambert avatar oblador avatar oney avatar patoroco avatar rollacaster avatar rorycombe avatar sunnyqin avatar tszajna0 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.