Я вызываю функцию plot () из HTML, но эта функция вызывается несколько раз.Его следует вызывать только один раз, когда условие выполняется. Моя функция plot () вызывается несколько раз, прежде чем выводится на карту.
plot(){
var self = this;
this.geolocation.getCurrentPosition().then((position) => {
let lat = self.lat;
let lng= self.lng;
console.log(lat);
console.log(lng);
let mapOptions = {
center: new google.maps.LatLng(lat,lng),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
this.addMarker();
}, (err) => {
console.log(err);
});
}
addMarker(){
console.log("coming in marker");
var self=this;
let lat = self.lat;
let lng= self.lng;
var markerPos = new google.maps.LatLng(lat,lng);
let marker = new google.maps.Marker({
map: self.map,
animation: google.maps.Animation.DROP,
position:markerPos,
});
console.log(marker.position);
let content = "<h4>Information!</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);
});
}
<div style="width: 80%;margin-right:3%;" *ngIf="chatMessage.types=='checkin' " class="message {{chatMessage.type === 'message_response' ? 'right' : 'left'}} img">
<img *ngIf="chatMessage.userIcon=='mji247'" src="assets/mji.png">
<img *ngIf="chatMessage.userIcon==''" src="assets/user.png">
<p style="font-size: 12px;white-space: pre-wrap;">{{this.chatMessage.msg.name}}:</p>
<div #map id="map" style="height: 200px;width: 225px;float: right;margin-right: 22px;border-radius: 5%;">
{{plot()}}
</div>
<p *ngIf="chatMessage.type != 'message_response'" style="overflow: auto;text-align: right;margin-left: 12%;font-size: 12px;white-space: pre-wrap;">{{this.chatMessage.msg.date}}</p>
<p *ngIf="chatMessage.type == 'message_response'" style="overflow: auto;font-size: 12px;white-space: pre-wrap;">{{this.chatMessage.msg.date}}</p>
</div>