Svelte wrapper for the official Google Maps Embed api.
npm install --save svelte-google-maps-embed
Use as a normal svelte component.
There are two parameters that must always be present:
apiKey: the API key you got from the Google Developers ConsolemapMode: one ofplace,directions,search,view,streetview
Depending on the mapMode, you will need some other parameters, as described in the Google documentation. See examples below.
<!-- A place -->
<GoogleMaps apiKey="YOUR_API_KEY" mapMode="place" q="Space+Needle,Seattle+WA" />
<!-- Directions -->
<GoogleMaps apiKey="YOUR_API_KEY" mapMode="directions" origin="Oslo+Norway"
destination="Telemark+Norway" avoid="tolls|highways" />
<!-- A search -->
<GoogleMaps apiKey="YOUR_API_KEY" mapMode="search"
q="record+stores+in+Seattle" />
<!-- A view -->
<GoogleMaps apiKey="YOUR_API_KEY" mapMode="view" center="-33.8569,151.2152"
zoom="18" maptype="satellite" />
<!-- A streetview -->
<GoogleMaps apiKey="YOUR_API_KEY" mapMode="streetview"
location="46.414382,10.013988" heading="210" pitch="10" fov="35" />
<script>
import { GoogleMaps } from 'svelte-google-maps-embed';
export default {
components: {
GoogleMaps
}
}
</script>- Fork it!
- Create your feature branch:
git checkout -b my-new-feature - Commit your changes:
git commit -am 'Add some feature' - Push to the branch:
git push origin my-new-feature - Submit a pull request
- Jeroen Coussement - @coussej - coussej.github.io
MIT