Get Location After Drag Marker in Google Maps... i Want Updated Lat Long After Drag & Drop ... Thanks in Advanced... This is My Code

Ionic Framework ionic-v3
1 
this.map.addMarker({
                  title: 'Ionic',
                  icon: 'blue',
                  animation: 'DROP',
                  draggable:true,
                  position: {
                    lat: lat1,
                    lng: lng1
                  }
                })
                .then(marker => {
                  marker.on(GoogleMapsEvent.MARKER_DRAG_END)
                    .subscribe(() => {
                      marker.getCurrentPosition().then((resp) => {

                           alert(resp);

                          }).catch((error) => {
                            console.log('Error getting location', error);
                          });
                    });
                });

              });

Problem :
Uncaught TypeError: marker.getCurrentPosition is not a function
at SafeSubscriber._next (main.js:815)
at SafeSubscriber.__tryOrUnsub (vendor.js:38438)
at SafeSubscriber.next (vendor.js:38385)
at Subscriber._next (vendor.js:38325)
at Subscriber.next (vendor.js:38289)
at Marker.trigger (plugins/cordova-plugin-googlemaps/www/BaseClass.js:62)
at Map._onMarkerEvent (plugins/cordova-plugin-googlemaps/www/Map.js:1129)
at Map.nativeCallback (plugins/cordova-plugin-googlemaps/www/googlemaps-cdv-plugin.js:690)
at Object.fireDocumentEvent (cordova.js:235)
at :1:28

2 Likes
2

i Got The Answer My Self :slight_smile:


this.map.one(GoogleMapsEvent.MAP_READY)
              .then(() => {
                console.log('Map is ready!');
        
                this.map.addMarker({
                  title: 'Ionic',
                  icon: 'blue',
                  animation: 'DROP',
                  draggable:true,
                  position: {
                    lat: lat1,
                    lng: lng1
                  }
                })
                .then(marker => {
                  marker.on(GoogleMapsEvent.MARKER_DRAG_END)
                    .subscribe(() => {
                      
                      this.markerlatlong = marker.getPosition();

                      localStorage.setItem("latt1",this.markerlatlong.lat);
                      localStorage.setItem("long1",this.markerlatlong.lng);

                      this.http.get('API URL').map(res => res.json()).subscribe(data => {
                        console.log(data);
                      });
                       
                    });
                });
                
              });

:sunglasses:

5 Likes
3

Thanks it worked for me too! :smiley:

1 Like
4

Thanks :slight_smile:

5

That’s the correct solution & worked for me!

1 Like
6

Can you please share the full code And let know which plugin you are using I could not find any plugin called google map in Ionic documentation just found geolocation and others…

1 Like
7
1 Like
8

I think your Problem Solved … :slight_smile:

9

Not Totally but I have found alternative method. So currently I am sticking with that.later I will update my code,

1 Like
10

this code working on gmpas native?

11

can you share it? someone might need it

12

Try this code.
Add listener when calling addmarker() to call getMarkerposition()

addMarker(latLng){
let marker = new google.maps.Marker({
map: this.map,
draggable:true,
animation: google.maps.Animation.DROP,
position: latLng
})

google.maps.event.addListener(marker,‘dragend’, () => {
this.getMarkerPosition(marker.getPosition());
});
}

getMarkerPosition(latlng){
var geocoder = new google.maps.Geocoder();
geocoder.geocode({‘latLng’: latlng},(results, status)=> {
let address= results[0].formatted_address;
console.log(address)
})

}

13

Please could you provide me your html code may be it’s help to others.