Geocoding services for react native.
The project is built on top of devfd/react-native-geocoder, due to original project is not likely being maintained. This fork should be a drop-in replacement. Some bug fixing and TypeScript support have being added.
Geocoder Version | RN |
---|---|
>=0.7.0 | >= 0.56.0 |
If you're using an older version of react-native, please consider using devfd/react-native-geocoder instead.
yarn add react-native-geocoder-reborn
or
npm install --save react-native-geocoder-reborn
cd ios && pod install && cd .. # CocoaPods on iOS needs this extra step
# run with react-native-cli
react-native run-ios
react-native run-android
Please review autolinking docs for detials.
If "Autolinking" is not available for you, please try the following:
Use `react-native link`
react-native link react-native-geocoder-reborn
Manually
If automatic linking fails you can follow the manual installation steps- In the XCode's "Project navigator", right click on Libraries folder under your project ➜
Add Files to <...>
- Go to
node_modules
➜react-native-geocoder-reborn
and addios/RNGeocoder.xcodeproj
file - Add libRNGeocoder.a to "Build Phases" -> "Link Binary With Libraries"
- In
android/setting.gradle
add:
...
include ':react-native-geocoder-reborn', ':app'
project(':react-native-geocoder-reborn').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-geocoder-reborn/android')
- In
android/app/build.gradle
...
dependencies {
...
implementation project(':react-native-geocoder-reborn')
}
- register module (in MainApplication.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
);
}
......
}
import Geocoder from 'react-native-geocoder-reborn';
// 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))
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-reborn';
// simply add your google maps key
Geocoder.fallbackToGoogle(YOUR_API_KEY);
// Add next line if you also want to use Google Maps api on iOS.
Geocode.forceGoogleOnIos(true);
// use the lib as usual
let res = await Geocoder.geocodePosition({lat, lng})
// you get the same results
import Geocoder from 'react-native-geocoder-reborn';
// Set language attribute before api calls.
Geocoder.setLanguage('fr'); // Set language to French.
let res = await Geocoder.geocodePosition({lat, lng});
Note: Platforms may have different implantations for locale preference. Here is Google Maps API supported language list.
import Geocoder from 'react-native-geocoder-reborn';
try {
...
await Geocoder.geocodePosition({ lat, lng });
...
await Geocoder.geocodeAddress('London');
...
} catch(err) {
console.log(err);
}
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
}
iOS does not allow sending multiple geocoding requests simultaneously, hence if you send a second call, the first one will be cancelled.