Как получить положение маркера после перетаскивания в vue2-google-map? - PullRequest
0 голосов
/ 13 мая 2018

Я использую библиотеку vue2-google-map для отображения карты с маркером.

<gmap-map ref="mymap" :center="mapStartLocation" :zoom="17" style="width: 100%; height: 300px">
    <gmap-marker v-on:change="updateCoordinates()" :position="mapStartLocation" :draggable="true" @closeclick="updateCoordinates()"/>
</gmap-map>

Это работает и ставит маркер на координаты mapStartLocation

Как получить новые координаты после того, как пользователь перетащил маркер на карту?

Я пытался с @closeClick и v-on: изменить, но ни один из них не регистрируется.Даже если они это сделают, вопрос о том, как получить новые значения координат, остается.

Любые указатели о том, как работать с этой библиотекой.Ничего в документации .

Ответы [ 2 ]

0 голосов
/ 05 марта 2019

Итак, Вы можете добавить Событие при перетаскивании по остановке

<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()}};
      },
0 голосов
/ 22 мая 2018

Я нашел @drag как лучшее решение.Тем не менее, событие генерируется во время перетаскивания пользователя, не только после которого @dragend должно работать в соответствии с исходным кодом , но по какой-то причине в моем случае это не так.

<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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...