如何在離子2中始終在可見區域更換標記？

Question

在長距離替換時，如果出現下面的代碼，它將會跳出屏幕，因此用戶應手動拖動地圖以將標記保持在屏幕的中心/可見區域。是否有任何可能的方式在可見區域保持地圖上的標記？

declare var google; 
@Component({ 
    selector: 'page-page1', 
    templateUrl: 'page1.html', 
    providers: [Geolocation] 
}) 
export class Page1 { 
    @ViewChild('map') mapElement: ElementRef; 
    map: any; 
    public marker ; 
    public lat; 
    public lng; 
    public speed = '0'; 
    public watch: any; 
    constructor(public navCtrl: NavController, public Geolocation: Geolocation, public zone: NgZone, 
) {} 
ionViewDidLoad(){ 
    this.loadMap(); 
    this.startTracking(); 

    } 

    loadMap(){ 

     this.Geolocation.getCurrentPosition().then((position) => { 
     let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
     let mapOptions = { 
     center: latLng, 
     zoom: 15, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 

     this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions); 
this.addMarker(); 
    }, (err) => { 
     console.log(err); 
    }); 

    } 
    startTracking() { 
    let config = { 
    desiredAccuracy: 0, 
    stationaryRadius: 20, 
    distanceFilter: 10, 
    debug: true, 
    interval: 2000 
    }; 


let options = { 
    frequency: 3000, 
    enableHighAccuracy: true 
}; 

this.watch = this.Geolocation.watchPosition(options).filter((p: any) => p.code === undefined).subscribe((position: Geoposition) => { 
    this.zone.run(() => { 
    this.lat = position.coords.latitude; 
    this.lng = position.coords.longitude; 
    this.marker.setPosition({lat: this.lat, lng: this.lng}); 
    this.speed =(+position.coords.speed*3.6) + 'Km/h'; 
    }); 

}); 

} 
stopTracking() { 
    console.log('stopTracking'); 
    this.watch.unsubscribe(); 

} 
addMarker(){ 
let marker = new google.maps.Marker({ 
    map: this.map, 
    animation: google.maps.Animation.DROP, 
    position: this.map.getCenter() 
    }); 
this.marker=marker; 
} 

} 

Answer 1

標記移動時使用setCenter來居中映射。

this.zone.run(() => { 
    this.lat = position.coords.latitude; 
    this.lng = position.coords.longitude; 
    this.marker.setPosition({lat: this.lat, lng: this.lng}); 

    this.map.setCenter({lat: this.lat, lng: this.lng}); 

    this.speed =(+position.coords.speed*3.6) + 'Km/h'; 
    });