Ionic - save latitude and longitude on firebase

Question

I created a project on Ionic and I would like that when the user clicked on "save location", the position from where he left the marker was saved in his user profile in firebase, however, I have no idea how to take the latitude and longitude of the marker and save in firebase, some solution???

      loadMap(){
        this.geolocation.getCurrentPosition().then((position)=> {
          let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); // pegando localização atual

          let mapOptions = { //opções do mapa
            center: latLng,
            zoom: 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disabledZoomDoubleClick: true,
            fullscreenControl: true
          }
          this.map = new google.maps.Map(document.getElementById('map'), mapOptions); //adicionando mapa com as opçoes

          let marker = new google.maps.Marker({ //Adicionando marcador
          map: this.map,
          animation: google.maps.Animation.DROP,
          position: latLng,
          draggable: true,

        });

        let data = {
          lat: null,
          lng: null
        }

        google.maps.event.addListener(marker, 'click', function(event){ //Aciona quando o usuario clica no marcador
          data.lat = event.latLng.lat();
          data.lng = event.latLng.lng();
        });

        }, (error) => {
          console.log(error);      
        });      

      }

  addFirebase(){ //aqui é a função do botão que vai salvar a localização

  }

Answer 1

To get your position in Latlng from the maker you need to implement a Listener that will be called every time you drag your marketing. Note that in the function I am waiting for the event of dragend, beyond these you can pass the dragstart and the drag, to learn more read the documentation You can create this function:

lastLatLng(marker) {
  google.maps.event.addListener(marker, 'dragend', () => {
    this.LastLat = marker.position.lat();
    this.LastLng = marker.position.lng();

    const toast = this.toast.create({
      message: `Latitude: ${this.LastLat}\nLongitude: ${this.LastLng}`,
      duration: 6000,
      position: 'botton'
    });
    toast.present();
  });
}

Notice that I created two variables LastLat and LastLng. Then you just call this function in its function loadMap and pass your marketing as parameter.

Now to pass this information on to Firebase I think I could ask another question, with this method you already have the lat and lng just take these variables in their function that sends the data to firebase.

Demo of the running app: