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 | - |