2017-12-19 26 views
0

후 나는 '마커 드래그 끝에'청취자에 의해 주어진 새로운 좌표를 설정하는 방법에 대한 이상한 문제에 직면하고있다. 두 변수가 도달하지 않거나 난 경우GOOGLEMAPS 기본 GET 마커의 위치를 ​​드래그

ERROR 
Error {rejection: TypeError, promise: t, zone: r, task: e, stack: (...)…} 
message: "Uncaught (in promise): TypeError: Cannot set property 'lat' of undefined↵TypeError: Cannot set property 'lat' of undefined↵ at file:///android_asset/www/build/28.js:180:27↵ at t.invoke (file:///android_asset/www/build/polyfills.js:3:14976)↵ at Object.zone._inner.zone._inner.fork.onInvoke (file:///android_asset/www/build/vendor.js:4248:33)↵ at t.invoke (file:///android_asset/www/build/polyfills.js:3:14916)↵ at r.run (file:///android_asset/www/build/polyfills.js:3:10143)↵ at file:///android_asset/www/build/polyfills.js:3:20242↵ at t.invokeTask (file:///android_asset/www/build/polyfills.js:3:15660)↵ at Object.zone._inner.zone._inner.fork.onInvokeTask (file:///android_asset/www/build/vendor.js:4239:33)↵ at t.invokeTask (file:///android_asset/www/build/polyfills.js:3:15581)↵ at r.runTask (file:///android_asset/www/build/polyfills.js:3:10834)" 
promise: t 
rejection: TypeError 
stack: (...) 
get stack: function() { [native code] } 
set stack: function() { [native code] } 
task: e 
zone: r 
__proto__: d 

그것의 좋아 : 나는 다음과 같은 오류가 이벤트 리스너에서 그들을 로그 아웃 콘솔하려고 할 때, 심지어 내 변수 this.lat 및 this.lng 또는를 설정하려고 할 때 몰라. 시도하지만 운이없이 지금 3 시간 동안 그것을 디버깅. 어쩌면 난 그냥 뭔가를 몰래하고, 그래서 어떤 도움이 많이 appreaciated 될 것이다. 해당 기능은 updatePosition의 다른 모든 작업이다.

import { Component } from '@angular/core'; 
import {IonicPage, NavController, NavParams, Platform} from 'ionic-angular'; 
import {HelperProvider} from "../../providers/helper/helper"; 
import { 
    GoogleMaps, 
    GoogleMap, 
    GoogleMapsEvent, 
    GoogleMapOptions, 
    Marker, CameraPosition, ILatLng 
} from '@ionic-native/google-maps'; 
import {Geolocation, GeolocationOptions} from "@ionic-native/geolocation"; 

@IonicPage() 
@Component({ 
    selector: 'page-statement', 
    templateUrl: 'statement.html', 
}) 
export class StatementPage { 

    map: GoogleMap; 
    lat:any; 
    lng:any; 
    settlementLat:any; 
    settlementLng:any; 
    geoLocationOption: GeolocationOptions; 
    showMap: boolean = false; 

    constructor(
    public navCtrl: NavController, 
    public platform: Platform, 
    private geoLocation: Geolocation, 
    private helper: HelperProvider, 
    public navParams: NavParams) { 

    const data = JSON.parse(localStorage.getItem('deviceData')); 

    if(data.settlementLat && data.settlementLng){ 
     this.settlementLat = data.settlementLat; 
     this.settlementLng = data.settlementLng; 
    } 

    } 

    openMap(){ 
    this.showMap = true; 
    setTimeout(()=> {this.loadMap()},500) 
    } 

    loadMap() { 
    this.map = GoogleMaps.create('statementMap', { 
     'camera': { 
     'target': { 
      "lat": parseFloat(this.settlementLat), 
      "lng": parseFloat(this.settlementLng) 
     }, 
     'zoom': 18 
     } 
    }); 

    this.map.one(GoogleMapsEvent.MAP_READY).then(() => { 

     this.geoLocationOption = { 
     maximumAge: 0, 
     timeout : 15000, 
     enableHighAccuracy: true 
     }; 

     this.helper.presentLoading('Searching for GPS position...'); 
     this.getPosition(); 
    }); 
    } 

    getPosition(){ 
    this.geoLocation.getCurrentPosition(this.geoLocationOption).then((resp) => { 
     this.helper.closeLoading(); 
     this.lat = resp.coords.latitude; 
     this.lng = resp.coords.longitude; 

     let position: CameraPosition<ILatLng> = { 
     target: { 
      lat: this.lat, 
      lng: this.lng 
     }, 
     zoom: 18 
     }; 

     this.map.moveCamera(position); 

     this.map.addMarker({ 
     icon: 'blue', 
     animation: 'DROP', 
     draggable: true, 
     position: { 
      lat: this.lat, 
      lng: this.lng 
     } 
     }).then(this.updatePosition) 

    }).catch((error) => { 
     this.helper.closeLoading(); 
     this.map.destroy(); 
     this.helper.presentToast('Please turn on your gps...'); 
     this.showMap = false; 
    }); 
    } 

    updatePosition(marker: Marker){ 
    marker.one(GoogleMapsEvent.MARKER_DRAG_END).then(() => { 
     this.lat = marker.getPosition().lat; 
     this.lng = marker.getPosition().lng; 

     console.log(this.lat); 
     console.log(this.lng); 
    }); 
    } 

} 

답변

1

은 당신이 다른 사람에 다른 문제가있을 수

getPosition(){ 
     this.geoLocation.getCurrentPosition(this.geoLocationOption).then((resp) => { 
     this.helper.closeLoading(); 
     var my_lat = resp.coords.latitude; 
     var my_lng = resp.coords.longitude; 

     let position: CameraPosition<ILatLng> = { 
      target: { 
      lat: this.lat, 
      lng: this.lng 
      }, 
      zoom: 18 
     }; 

     this.map.moveCamera(position); 

     this.map.addMarker({ 
      icon: 'blue', 
      animation: 'DROP', 
      draggable: true, 
      position: { 
      lat: my_lat, 
      lng: my_lng 
      } 
     }).then(this.updatePosition) 

     }).catch((error) => { 
     this.helper.closeLoading(); 
     this.map.destroy(); 
     this.helper.presentToast('Please turn on your gps...'); 
     this.showMap = false; 
     }); 
    } 

코드가 위도와 LNG에 대한 솔루션을 제안이 운영자 등의 잘못된 사용을 피하려고 : 여기

내 코드입니다 이

+0

의 부적절한 사용은 여전히 ​​내 this.lat 및 this.lng에게 도달 할 abble 않네,하지만 난 내 this.updatePosition을 제거하고 대신 그 지방 화살표 기능을 만든 갑자기 그 변수는 reachebl했다 다시 전자. 그래서 문제는 해결되었고 노력에 감사드립니다 :) – trix87