我在角项目(ngx-google-places-autocomplete and angular/google-maps
)中使用谷歌地图。功能就像用户可以选择位置并存储其纬度和经度。现在取决于纬度,长期存储,我需要在该坐标上显示谷歌地图和标记。
HTML
<google-map
width="400px"
height="280px"
[zoom]="zoom"
[center]="initialCoordinates"
[options]="mapConfigurations">
</google-map>
ts
export class SampleComponent implements OnInit {
myDetails: any = [];
mylat: string = "51.076101702905575"; // default lat
mylong: string = "10.867780927493548"; // default long
zoom = 12;
initialCoordinates = {
lat: +this.myLat,
lng: +this.myLong,
};
mapConfigurations = {
disableDefaultūI: true,
fullscreenControl: true,
zoomControl: true,
mapTypeId: "roadmap",
scrollwheel: false,
disableDoubleClickZoom: true,
};
ngOnInit(): void {
this.getDetails();
}
getDetails() {
this.myService.getDetails(this.formData).subscribe((data) => {
if (data["status"] === false) {
} else {
this.myDetails = data["data"];
this.myLat = this.myDetails.latitude;
this.myLong = this.myDetails.longitude;
}
});
}
}
上面的代码每次都显示默认纬度、经度设置的地图。 myLat, myLong
变量总是采用默认值。它不会用我在getDetails
函数中设置的数据库值覆盖。作为 Angular 的初学者,我不确定如何实现这一点。
我应该如何设置数据库获取的纬度,长谷歌地图并在上面显示标记?
请帮助和指导。