Skip to main content
se añadieron 296 caracteres en el cuerpo
Origen Enlace
mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
var eventLatLng = { lat: event.latLng.lat(), lng: event.latLng.lng() };
      this.lat = event.latLng.lat();
      this.lng = event.latLng.lng();
      marker.setPosition(eventLatLng);
      this.map.setCenter(new google.maps.LatLng(this.lat, this.lng));
      var infowindow = new google.maps.InfoWindow({
        content: 'Marker Location:' + marker.getPosition()
      });
  
      infowindow.open(this.map, marker);
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa. Ahora mi problema es que necesito que forzosamente sea una modal.

***Y porfin pude hacer que funcionara, el tema era que la modal por alguna razon no podia pasarle sus propiedades al mapa, entonces simplemente hay que forzar al mapa a desplegarse con un tamaño definido y listo:

#map {
height: 500px !important;
width: 500px !important;

}

mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
var eventLatLng = { lat: event.latLng.lat(), lng: event.latLng.lng() };
      this.lat = event.latLng.lat();
      this.lng = event.latLng.lng();
      marker.setPosition(eventLatLng);
      this.map.setCenter(new google.maps.LatLng(this.lat, this.lng));
      var infowindow = new google.maps.InfoWindow({
        content: 'Marker Location:' + marker.getPosition()
      });
  
      infowindow.open(this.map, marker);
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa. Ahora mi problema es que necesito que forzosamente sea una modal.

mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
var eventLatLng = { lat: event.latLng.lat(), lng: event.latLng.lng() };
      this.lat = event.latLng.lat();
      this.lng = event.latLng.lng();
      marker.setPosition(eventLatLng);
      this.map.setCenter(new google.maps.LatLng(this.lat, this.lng));
      var infowindow = new google.maps.InfoWindow({
        content: 'Marker Location:' + marker.getPosition()
      });
  
      infowindow.open(this.map, marker);
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa. Ahora mi problema es que necesito que forzosamente sea una modal.

***Y porfin pude hacer que funcionara, el tema era que la modal por alguna razon no podia pasarle sus propiedades al mapa, entonces simplemente hay que forzar al mapa a desplegarse con un tamaño definido y listo:

#map {
height: 500px !important;
width: 500px !important;

}

se añadieron 497 caracteres en el cuerpo
Origen Enlace
mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
var eventLatLng = { /*lat: event.latLng.lat(), lng: event.latLng.lng() };
      this.placeMarkerlat = event.latLng.lat();
      this.lng = event.latLng.lng(); 
 */     marker.setPosition(eventLatLng);
      this.map.setCenter(new google.maps.LatLng(this.lat, this.lng));
      var infowindow = new google.maps.InfoWindow({
        content: 'Marker Location:' + marker.getPosition()
      });
  
      infowindow.open(this.map, marker);
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa. Ahora mi problema es que necesito que forzosamente sea una modal.

mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
    /* this.placeMarker(event); */
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa.

mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
var eventLatLng = { lat: event.latLng.lat(), lng: event.latLng.lng() };
      this.lat = event.latLng.lat();
      this.lng = event.latLng.lng(); 
      marker.setPosition(eventLatLng);
      this.map.setCenter(new google.maps.LatLng(this.lat, this.lng));
      var infowindow = new google.maps.InfoWindow({
        content: 'Marker Location:' + marker.getPosition()
      });
  
      infowindow.open(this.map, marker);
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa. Ahora mi problema es que necesito que forzosamente sea una modal.

Origen Enlace

mapInitializer() {
  let coordinates = new google.maps.LatLng(this.lat, this.lng);

let mapOptions: google.maps.MapOptions = {
 center: coordinates,
 zoom: 16
};

let marker = new google.maps.Marker({
  position: coordinates,
  map: this.map,
});
  this.map = new google.maps.Map(this.gmap.nativeElement, 
  mapOptions);
  google.maps.event.addListener(this.map, 'click', (event) => {
    /* this.placeMarker(event); */
  });
  marker.setMap(this.map);
}

Ya comprobe que era la sintaxis, si lo cargo como un componente independiente y no una modal, si carga el mapa.