Skip to content

Commit a6accca

Browse files
committed
docs: add readme for v1.0 release
1 parent 862e75a commit a6accca

File tree

1 file changed

+196
-6
lines changed

1 file changed

+196
-6
lines changed

README.md

Lines changed: 196 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,212 @@
1-
# @react-native-community/geocoder
1+
# React Native Geocoder
22

3-
A multi-platform geocoder library for React Native apps.
3+
Multi-platform Geocoding library for React Native apps.
4+
5+
6+
[![CircleCI](https://circleci.com/gh/timwangdev/react-native-geocoder-reborn/tree/master.svg?style=shield)](https://circleci.com/gh/timwangdev/react-native-geocoder-reborn/tree/master)
7+
[![npm](https://img.shields.io/npm/v/@timwangdev/react-native-geocoder.svg)](https://www.npmjs.com/package/@timwangdev/react-native-geocoder)
8+
[![Downloads](https://img.shields.io/npm/dw/@timwangdev/react-native-geocoder.svg)](https://www.npmjs.com/package/@timwangdev/react-native-geocoder)
9+
10+
The project is originally forked from [devfd/react-native-geocoder](https://github.com/devfd/react-native-geocoder). Since 1.0 the project have been refactored and supports more features includes maximum results limit, search boundary and React hooks.
11+
12+
**Please check the [Release page](https://github.com/timwangdev/react-native-geocoder-reborn/releases/tag/v1.0.0) for Version 1.0.0 Full Changelog and Migration Guide.**
413

514
## Installation
615

716
```sh
8-
npm install @react-native-community/geocoder
17+
npm install @timwangdev/react-native-geocoder
18+
```
19+
20+
or
21+
22+
```sh
23+
yarn add @timwangdev/react-native-geocoder
24+
```
25+
26+
## Link
27+
28+
### Autolinking with `react-native-cli` (requires `react-native` 0.60 or above)
29+
30+
Please review [autolinking docs](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md) for detials.
31+
32+
If "Autolinking" is not available for you, please try the following:
33+
34+
<details><summary>Use `react-native link`</summary>
35+
36+
```
37+
react-native link @timwangdev/react-native-geocoder
38+
```
39+
</details>
40+
41+
<details><summary>Manually</summary>
42+
If automatic linking fails you can follow the manual installation steps
43+
44+
#### iOS (With CocoaPods)
45+
46+
1. Add `pod 'react-native-geocoder', :path => '../node_modules/@timwangdev/react-native-geocoder/react-native-geocoder.podspec'` to your Podfile.
47+
2. Run `pod install`.
48+
49+
#### iOS (Without CocoaPods)
50+
51+
1. In the XCode's "Project navigator", right click on Libraries folder under your project ➜ `Add Files to <...>`
52+
2. Go to `node_modules``@timwangdev/react-native-geocoder` and add `ios/RNGeocoder.xcodeproj` file
53+
3. Add `libGeocoder.a` to "Build Phases" -> "Link Binary With Libraries"
54+
55+
#### Android
56+
57+
1. In `android/setting.gradle` add:
58+
59+
```gradle
60+
...
61+
include ':react-native-geocoder', ':app'
62+
project(':react-native-geocoder').projectDir = new File(rootProject.projectDir, '../node_modules/@timwangdev/react-native-geocoder/android')
63+
```
64+
65+
2. In `android/app/build.gradle`
66+
67+
```gradle
68+
...
69+
dependencies {
70+
...
71+
implementation project(':react-native-geocoder')
72+
}
973
```
1074

75+
3. Register module (in MainApplication.java)
76+
77+
```java
78+
import com.timwangdev.reactnativegeocoder.GeocoderPackage; // <--- Add this line
79+
80+
public class MainActivity extends ReactActivity {
81+
...
82+
@Override
83+
protected List<ReactPackage> getPackages() {
84+
...
85+
packages.add(new GeocoderPackage()); // <--- Add this line
86+
87+
return packages;
88+
}
89+
...
90+
}
91+
```
92+
</details>
93+
1194
## Usage
1295

1396
```js
14-
import Geocoder from "@react-native-community/geocoder";
97+
import Geocoder from '@timwangdev/react-native-geocoder';
98+
99+
try {
100+
...
101+
const position = { lat: 1.2, lng: -3.4 };
102+
await Geocoder.geocodePosition(position);
103+
...
104+
await Geocoder.geocodeAddress('Paris', {
105+
locale: 'fr',
106+
maxResult: 2
107+
});
108+
...
109+
} catch(err) {
110+
console.log(err);
111+
}
112+
```
113+
114+
### Geocode Address
15115

16-
// ...
116+
* `Geocoder.geocodeAddress(address: string, options?: GeocoderOptions)`
17117

18-
const deviceName = await Geocoder.getDeviceName();
118+
* Returns `Promise<GeocodingObject[]>`
119+
120+
* Supports `regionIos` on iOS.
121+
122+
* Supports `bounds` on Android and Google Maps API.
123+
124+
### Geocode Position (Reverse Geocoding)
125+
126+
* `Geocoder.geocodePosition(position: { lat: number, lng: number }, options?: GeocoderOptions)`
127+
128+
* Returns `Promise<GeocodingObject[]>`
129+
130+
### `GeocoderOptions`
131+
132+
```typescript
133+
{
134+
// Your Google Maps API key, required if when `fallbackToGoogle` or `forceGoogleOnIos` is set.
135+
apiKey?: string;
136+
137+
// Preferred Locale for outputs, defaults to 'en'
138+
locale?: string;
139+
140+
// (Not available for Google Maps) Maximum returned results, defaults to 5
141+
maxResults?: number;
142+
143+
// (Android and Google only) Set the bounds for address geocoding.
144+
bounds?: {
145+
sw: { lat: number, lng: number }, // Lower left corner
146+
ne: { lat: number, lng: number }, // Upper right corner
147+
};
148+
149+
// (iOS native only) Set circular region for address geocoding.
150+
regionIos?: {
151+
center: { lat: number, lng: number }, // Center of the circular region
152+
radius: number, // Radius of the circular region, unit: km
153+
};;
154+
155+
// Should use Google Maps API if native query fails, defaults to false.
156+
fallbackToGoogle?: boolean;
157+
158+
// Should always use Google Maps API on iOS, defaults to false.
159+
forceGoogleOnIos?: boolean;
160+
}
19161
```
162+
Note: Platforms may have different implantations for locale preference. Here is [Google Maps API supported language list](https://developers.google.com/maps/faq#languagesupport).
163+
164+
### `GeocodingObject`
165+
166+
```typescript
167+
{
168+
position: { lat: number, lng: number };
169+
170+
// The full formatted address
171+
formattedAddress: string;
172+
173+
// Example: Yosemite Park, Eiffel Tower
174+
feature: string | null;
175+
176+
streetNumber: string | null;
177+
178+
streetName: string | null;
179+
180+
postalCode: string | null;
181+
182+
// City name
183+
locality: string | null;
184+
185+
country: string;
186+
187+
countryCode: string;
188+
189+
adminArea: string | null;
190+
191+
subAdminArea: string | null;
192+
193+
subLocality: string | null;
194+
}
195+
```
196+
197+
### React Hooks Support
198+
199+
```js
200+
import { useGeocodeAddress, useGeocodePosition } from '@timwangdev/react-native-geocoder';
201+
```
202+
203+
* `useGeocodeAddress(address: string, options?: GeocoderOptions)`
204+
205+
Returns `{ result: GeocodingObject[], error: Error, loading: boolean }`
206+
207+
* `useGeocodePosition(position: { lat: number, lng: number }, options?: GeocoderOptions)`
208+
209+
Returns `{ result: GeocodingObject[], error: Error, loading: boolean }`
20210

21211
## License
22212

0 commit comments

Comments
 (0)