How to move map under marker


#1

Hi guys, anyone can help how can I add a marker to map and could move map under the marker.
adding marker is working and drop marker in the center of page but if i move page marker will move

addMarker(){
   let marker = new google.maps.Marker({
    map: this.map,
    animation: google.maps.Animation.DROP,
    position: this.map.getCenter()
  }); 
            
 let content = "<h4>some info!!!</h4>";
 this.addInfoWindow(marker, content);
}
addInfoWindow(marker, content){
 
  let infoWindow = new google.maps.InfoWindow({
    content: content
  }); 
  google.maps.event.addListener(marker, 'click', () => {
    infoWindow.open(this.map, marker);
  });
}


#2

Hi @Parsian just add draggable: true to your code.

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

  });

#3

@rsa In My case when i put position: this.map.getCenter() i cant see the marker

loadMap(){
    this.mapElement = document.getElementById('map');
    let mapOptions: GoogleMapOptions = {
      camera: {
        duration: 40,
        target: {
          lat: this.lat,
          lng: this.lng
        },
          zoom: 16,
          tilt: 30,
      }
    };
    this.map = this.googleMaps.create(this.mapElement, mapOptions);
    this.map.one(GoogleMapsEvent.MAP_READY)
      .then(() => {
        this.map.addMarker(  
        {
          map: this.map,
          icon: 'red',
          animation: google.maps.Animation.DROP,
          draggable: true,
          position: this.map.getCenter()
        })
          .then(marker => {
            marker.addEventListener(GoogleMapsEvent.MARKER_DRAG_END)
              .subscribe(() => {
                this.spiner = true;
                this.getMcurrentlocation(marker.getPosition());
              });
          });
      });
  }

i can see just an empty map

i am using ionic 2