vue-location-picker
v1.0.1
Published
Location Picker component for Vue.js
Downloads
146
Maintainers
Readme
Location Picker
Install via NPM
Available through npm as vue-location-picker
.
npm install --save vue-location-picker
Usage
import LocationPickerInit from 'vue-location-picker/src/init'
import LocationPicker from 'vue-location-picker'
new Vue({
el: 'body',
// You need to call the LocationPickerInit(appInstance, configObject, optionsObject)
ready () {
LocationPickerInit(
this,
// config object
{
key: 'GoogleMapsApiKey', // required
language: 'en-US' // optional
},
// options object
{
map: {
center: { lat: 0, lng: 0 },
/** other map options **/
},
marker: { /** marker options **/ },
infoWindow: { /** info window options **/ },
autocomplete: { /** autocomplete options **/ }
}
)
},
data: {
place: null // optional
},
components: { LocationPicker }
})
<!-- If you want to get to the selected place, use the 2-way binding variable -->
<location-picker :place.sync="place"></location-picker>
Use a custom info window
<!-- MyInfoWindow.vue -->
<template>
<!-- ... -->
</template>
<script>
export default {
// You should implement these 2 methods
methods: {
showAddress (place) {
// ..
},
showError () {
// ..
}
}
}
</script>
// MyLocationPicker.js
import LocationPicker from 'vue-location-picker'
import InfoWindow from './MyInfoWindow.vue'
export default Object.assign(LocationPicker, {
components: { InfoWindow }
})
// main.js
import LocationPicker from './MyLocationPicker'
new Vue({
components: { LocationPicker }
})
License
LocationPicker is released under the MIT License. See the bundled LICENSE file for details.