nativescript-google- map -sdk:当在运行时设置纬度和经度时，映射中心不正确

Question

本地语言-google-maps sdk

我正在OnInit的运行时设置纬度和经度值，但地图没有正确地居中(以0纬度和0经度为中心)。我试过使用mapView.updateCamera()，但它不会刷新位置。我还设置了一个具有相同纬度和纬度值的标记，这将在地图上正确显示，因此我的变量具有正确的值(我还使用console.log检查过)。尽管如此，如果在类中的声明中设置了纬度和经度，则地图是居中的。

这里是map.component.ts：

import { Component, ElementRef, ViewChild, OnInit } from '@angular/core';

import { registerElement } from 'nativescript-angular/element-registry';
import { MapView, Marker, Position, latitudeProperty } from 'nativescript-google-maps-sdk';

// Important - must register MapView plugin in order to use in Angular templates
registerElement("MapView", () => require("nativescript-google-maps-sdk").MapView);

import { ActivatedRoute } from "@angular/router";


@Component({
  moduleId: module.id,
  selector: 'app-map',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.css']
})
export class MapComponent implements OnInit {

  //latitude =  38.735231; //Map is centered correctly if uncommented
  //longitude = -9.146986; //Map is centered correctly if uncommented
  latitude: number;   //Initialized in ngOnInit()!
  longitude: number;  //Initialized in ngOnInit()!

  zoom = 17;
  bearing = 0;
  tilt = 0;
  padding = [40, 40, 40, 40];
  mapView: MapView;

  lastCamera: String;

  constructor(private route: ActivatedRoute, ) {
  }

  ngOnInit() {
    this.latitude = this.route.snapshot.params["lat"];
    this.longitude = this.route.snapshot.params["lon"];
    console.log("1- Lat: " + this.latitude + ", Lon: " + this.longitude); //OK!
  }

  //Map events
  onMapReady(event) {
    console.log('Map Ready');

    this.mapView = event.object;

    console.log("2- Lat: " + this.latitude + ", Lon: " + this.longitude); //OK!

    this.mapView.updateCamera(); //NOT working!!!

    console.log("Setting a marker...");

    var marker = new Marker();
    marker.position = Position.positionFromLatLng(this.latitude, this.longitude);
    marker.title = "JLD Saldanha";
    marker.snippet = "Av. Duque D'Avila, n°46C 1050-053 Lisboa";
    marker.userData = { index: 1 };
    this.mapView.addMarker(marker);
    marker.showInfoWindow();


  }

  onCoordinateTapped(args) {
    console.log("Coordinate Tapped, Lat: " + args.position.latitude + ", Lon: " + args.position.longitude, args);
  }

  onMarkerEvent(args) {
    console.log("Marker Event: '" + args.eventName
      + "' triggered on: " + args.marker.title
      + ", Lat: " + args.marker.position.latitude + ", Lon: " + args.marker.position.longitude, args);
  }

  onCameraChanged(args) {
    console.log("Camera changed: " + JSON.stringify(args.camera), JSON.stringify(args.camera) === this.lastCamera);
    this.lastCamera = JSON.stringify(args.camera);
  }

}

Answer 1

解决问题：

问题是角中的路由参数是字符串，而分量变量纬度和经度是数字，因此它无法在OnInit中正确地赋值。

通过添加+前缀将字符串转换为数字解决了问题：

ngOnInit() 
{ 
  this.latitude = +this.route.snapshot.params["lat"]; 
  this.longitude = +this.route.snapshot.params["lon"]; 
}