Saltar al contenido

cómo hacer zoom al marcador exacto google maps ejemplo de código agm angular 10

Posteriormente a consultar con especialistas en este tema, programadores de deferentes áreas y profesores dimos con la respuesta a la cuestión y la compartimos en esta publicación.

Ejemplo 1: zoom agm al marcador

<agm-map [zoom]="13"[latitude]="127.1"[longitude]="141.1"><agm-marker [latitude]="127.1"[longitude]="141.1"></agm-marker></agm-map>

Ejemplo 2: mapa de zoom alrededor del marcador angular

importComponent,OnInit,ViewChild,AfterViewInitfrom'@angular/core';importMyMarkerfrom'./marker';importMarkersServicefrom'./markers.service';importGoogleMapsAPIWrapper,AgmMap,LatLngBounds,LatLngBoundsLiteralfrom'@agm/core';

declare var google: any;

@Component(
  selector:'app-root',
  templateUrl:'./app.component.html',
  styleUrls:['./app.component.css'])exportclassAppComponentimplementsOnInit,AfterViewInit

  title ='AGM project (so48865595)';
  lat =41.399115;
  lng =2.160962;
  markers:MyMarker[];

  @ViewChild('AgmMap') agmMap:AgmMap;constructor(private markersService:MarkersService)ngOnInit()this.getMarkers();ngAfterViewInit()console.log(this.agmMap);this.agmMap.mapReady.subscribe(map=>const bounds:LatLngBounds=newgoogle.maps.LatLngBounds();for(const mm ofthis.markers)
        bounds.extend(newgoogle.maps.LatLng(mm.lat, mm.lng));
      map.fitBounds(bounds););getMarkers():voidthis.markers=this.markersService.getMarkers();mapIdle()console.log('idle');

No se te olvide compartir esta reseña si te fue de ayuda.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *