[ad_1]
So the code below is responsible for getting the customers data and show the customers locations on the google map, but I want to implement an infoWindow in each of the shown markers:
ngOnInit(): void {
this.subs.add(this.clienteService.getListClientes().subscribe((res) => {
console.log(res);
this.dataArray = res;
this.dataSource = new MatTableDataSource<Cliente>(this.dataArray);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
res.forEach(cliente => {
this.markers.push(new google.maps.Marker({
position: {
lat: parseFloat(cliente.latitude) ,
lng: parseFloat(cliente.longitude) ,
},
draggable: false,
label: {
text: cliente.nome,
fontSize: '17px',
fontWeight: 'bold',
}
}));
});
},
(err: HttpErrorResponse) => {
console.log(err);
}));
}
Can someone help me? If more code is needed for better understanding please tell me, i’m new on Angular and API’s.
Thanks!
Btw, this is the HTML code for the map:
<div class="col-6">
<google-map [center]="options.center" [zoom]="options.zoom">
<map-marker
*ngFor="let marker of markers"
[label]="marker.label"
[position]="marker.position"
[options]="marker.options"
>
</map-marker>
</google-map>
</div>
[ad_2]