Skip to content
A place picker inspired by the 'Autocomplete places with Aurelia.io' blog by François Wouts
JavaScript Other
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build
dist
doc
src
styles
test
.editorconfig
.eslintrc
.gitignore
.npmignore
CONTRIBUTING.md
LICENSE
README.md
config.js
gulpfile.js
karma.conf.js
package.json

README.md

Aurelia-place-picker

This aurelia plugin is a wrapper around the google.maps.places.autocomplete. It renders a searchbox and returns an object with the placename, latitude and longitude coordinates

See the example: here; The inspiration: here;

Installation

jspm install npm:aurelia-place-picker

Or for webpack:

npm install aurelia-place-picker

Usage

In your main.js:

.plugin('aurelia-place-picker', config => {
      config.options({
      apiKey: '[YOUR API KEY HERE]',          //Required
      getAPI: true,                           //Optional, see 'Problems'
      apiLoadedEvent: 'googlemap:api:loaded'  //Optional, see 'Problems'
    });

Then in your HTML:

<place-picker location.bind="location"></place-picker>

And finally the CSS:

.aurelia-place-picker{
 [YOUR STYLE HERE]
}

It returns an object:

location = {
  name: 'location name',
  lat: '12.3456',
  lng: '98.7654'
}

And fires an event:

  • placePicker:place_changed with the location object as payload.

Problems

If you try to use this together with the aurelia-google-maps plugin, you'll get an error:

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

If this is the case, you need to set the getAPI property to false and have to set a name for the apiLoadedEvent. At the time of writing, the aurelia-google-maps plugin will not fire an event, so this will not work. I suggest you go to My Fork and overwrite the dist folder in you node_modules. Let's hope my pull request will get merged soon.

You can’t perform that action at this time.