svelte-googlemaps
svelte-googlemaps copied to clipboard
Published
20 hours ago •
beyonk-group
beyonk-group
Svelte Google Maps Components
Svelte Google Maps
Maps and Places components in Vanilla JS (or Svelte)
Particular focus on efficient loading of Google components in an SPA.
SSR Ready
WIP
Documentation is a WIP. Be prepared to examine the source code to get any use out of this right now!
The GoogleMap and GooglePlacesAutocomplete components are a Google Map and Google Places Autocomplete component respectively.
Usage
To use within a Svelte application:
<GooglePlacesAutocomplete apiKey="your-maps-api-key"/>
<GoogleMap apiKey="your-maps-api-key"/>
<script>
import { GoogleMap, GooglePlacesAutocomplete } from '@beyonk/svelte-googlemaps'
</script>
Options
Autocomplete
| Attribute | Purpose | Allowed | Default |
|---|---|---|---|
| ariaLabel | Sets aria-label value on input | string | 'location' |
| on:placeChanged | Place changed event (does not fire if user hit enter without selecting an address) | any function | - |
| placeholder | placeholder text | any string | - |
| styleClass | css styles for input | any classes | - |
beyonk-group