Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/benedictkhoo/nativescript-google-places-sdk
NativesScript plugin for Google Places SDK
https://github.com/benedictkhoo/nativescript-google-places-sdk
android google-places ios mobile nativescript plugin
Last synced: about 2 months ago
JSON representation
NativesScript plugin for Google Places SDK
- Host: GitHub
- URL: https://github.com/benedictkhoo/nativescript-google-places-sdk
- Owner: benedictkhoo
- License: mit
- Created: 2019-08-08T05:37:56.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T08:32:53.000Z (about 2 years ago)
- Last Synced: 2024-11-13T12:14:10.787Z (about 2 months ago)
- Topics: android, google-places, ios, mobile, nativescript, plugin
- Language: TypeScript
- Size: 4.77 MB
- Stars: 3
- Watchers: 1
- Forks: 4
- Open Issues: 32
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# NativesScript Google Place SDK
A NativesScript plugin for Google Places SDK.
Documentation:
* [Places SDK for Android](https://developers.google.com/places/android-sdk/intro)
* [Places SDK for iOS](https://developers.google.com/places/ios-sdk/intro)
## Requirements
Enable Google Places API if you have not already done so.
Configure skip library check in tsconfig.json
```
{
"compilerOptions": {
...
"skipLibCheck": true
...
}
}
```
## Installation
```
tns plugin add nativescript-google-place-sdk
```
## Usage
### NativeScript
Initialize the Place SDK
app.ts
```
...
Place.initialize(isAndroid ? 'GOOGLE_PLACE_ANDROID_API_KEY' : 'GOOGLE_PLACE_IOS_API_KEY');
...
```
Show the Autocomplete UI
my-awesome-page.xml
```
```
my-awesome-page.ts
```
export function search(): void {
PlaceAutocomplete.show()
.then(
(result) => {
if (result) {
console.log('Place Details:', result);
}
},
(err) => console.error(err)
);
}
```
### NativeScript + Angular
Initialize the Place SDK
app.component.ts
```
@Component({
moduleId: module.id,
selector: 'ns-app',
templateUrl: 'app.component.html'
})
export class AppComponent implements OnInit {
ngOnInit(): void {
Place.initialize(isAndroid ? 'GOOGLE_PLACE_ANDROID_API_KEY' : 'GOOGLE_PLACE_IOS_API_KEY');
}
}
```
Show the Autocomplete UI
my-awesome.component.html
```
```
my-awesome.component.ts
```
@Component({
moduleId: module.id,
selector: 'ns-awesome',
templateUrl: 'my-awesome.component.html'
})
export class MyAwesomeComponent {
search(): void {
PlaceAutocomplete.show()
.then(
(result) => {
if (result) {
console.log('Place Details:', result);
}
},
(err) => console.error(err)
);
}
}
```
## API
### Place
#### initialize(apiKey)
| Property | Default | Description |
| --- | --- | --- |
| apiKey | undefined | Google Place API key |
Example
```
Place.initialize('GOOGLE_PLACE_API_KEY');
```
### Autocomplete
#### show(options)
| Property | Default | Description |
| --- | --- | --- |
| fields | undefined | Define the types of field to retrieve. By default will retrieve all types. |
| ios | undefined | iOS related options |
| ios.appearance | undefined | iOS appearance options. See [documentation](https://developers.google.com/places/ios-sdk/autocomplete#customize_text_and_background_colors) for more info. |
| ios.appearance.primaryTextColor | undefined | Primary text color |
| ios.appearance.primaryTextHighlightColor | undefined | Primary text highlight color |
| ios.appearance.secondaryTextColor | undefined | Secondary text color |
| ios.appearance.tableCellBackgroundColor | undefined | Table cell background color |
| ios.appearance.tableCellSeparatorColor | undefined | Table cell separator color |
| ios.appearance.tintColor | undefined | Tint color |
| locationBias.southwest | undefined | Southwest bound |
| locationBias.northeast | undefined | Northeast bound |
| Field | Data Type | Description |
| --- | --- | --- |
address | string | Address |
id | string | Id |
lat_lng | object | Coordinates |
name | string | Place name |
phone_number | string | Phone number |
price_level | number | Pricing |
rating | number | Rating |
user_ratings_total | number | Total ratings |
utc_offset_minutes | number | UTC offset in minutes |
viewport | object | Viewport |
website_uri | string | URL |
Example
```
PlaceAutocomplete.show({ fields: ['name'] })
.then(
(result) => {
if (result) {
console.log('Place Details:', result);
}
},
(err) => console.error(err)
);
```
## License
MIT