0

我在角项目(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 的初学者,我不确定如何实现这一点。

我应该如何设置数据库获取的纬度,长谷歌地图并在上面显示标记?

请帮助和指导。

4

0 回答 0