How to get marker position after dragging in vue2-google-map?
I found @drag
to be the best solution. However, the event is emitted while the user is dragging, not only after, to which @dragend
should work according to source-code, but for some reason doesn't in my case.
<template>
<gmap-map ref="mymap" :center="mapStartLocation" :zoom="17" style="width: 100%; height: 300px">
<gmap-marker :position="mapStartLocation" :draggable="true" @drag="updateCoordinates" />
</gmap-map>
</template>
<script>
export default {
data() {
return {
coordinates: null,
}
},
methods: {
updateCoordinates(location) {
this.coordinates = {
lat: location.latLng.lat(),
lng: location.latLng.lng(),
};
},
},
}
</script>
So, You can add Event on stop drag
<GmapMarker
:position="jdata.geo"
:clickable="true"
:draggable="true"
@dragend="gMapFunc($event.latLng)"
</GmapMarker>
////////////////////////
methods: {
//set after merker end drag
gMapFunc(evnt) {
this.jdata = {"geo": {"lat":evnt.lat(), "lng":evnt.lng()}};
},