У меня есть приложение Ionic, использующее карты Google.Я пытаюсь получить широту и долготу из данных json api для маршрута полета, а затем внедрить эти массивы данных в полилинию Карт Google.Получить данные json api работает нормально без проблем, но когда я помещаю объекты в Google Maps, я получаю ошибку
ERROR Error: Uncaught (in promise): TypeError: Cannot use 'in' operator to search for 'getPosition' in 40.11882
TypeError: Cannot use 'in' operator to search for 'getPosition' in 40.11882
at getLatLng (Common.js:544)
at Array.map (<anonymous>)
at Object.convertToPositionArray (Common.js:575)
at Map.addPolyline (Map.js:1231)
at vendor.js:76340
мой код
export class HomePage{
map: GoogleMap;
latitude: any;
longitude: any;
dates=[]
constructor(
public toastCtrl: ToastController,
private platform: Platform,
private http: HTTP
) { }
ngOnInit() {
// Since ngOnInit() is executed before `deviceready` event,
// you have to wait the event.
this.platform.ready();
this.getmarker();
this.loadMap();
}
async getmarker(){
this.http.get('/v1/flightjson?flightId=201',{},{})
.then( data=>{
// this.latitude = JSON.parse(data.data).result.response.data.flight.track.latitude
// this.longitude = JSON.parse(data.data).result.response.data.flight.track
for(let datas of JSON.parse(data.data).result.response.data.flight['track']) {
this.longitude = datas.longitude
this.latitude = datas.latitude
console.log(this.longitude, this.latitude)
}
})
}
loadMap() {
let AIR_PORTS = [
this.longitude = datas.longitude
this.latitude = datas.latitude
];
console.log(AIR_PORTS)
this.map = GoogleMaps.create('map_canvas');
let polyline: Polyline = this.map.addPolylineSync({
points: AIR_PORTS,
color: '#AA00FF',
width: 10,
geodesic: true,
clickable: true // clickable = false in default
});
polyline.on(GoogleMapsEvent.POLYLINE_CLICK).subscribe((params: any) => {
let position: LatLng = <LatLng>params[0];
let marker: Marker = this.map.addMarkerSync({
position: position,
title: position.toUrlValue(),
disableAutoPan: true
});
marker.showInfoWindow();
});
}
}
консольный журнал для AIR_PORTS
![enter image description here](https://i.stack.imgur.com/7X9Qz.png)
мои данные json url
оригинальный код
export class PolylinePage implements OnInit {
map: GoogleMap;
constructor(private platform: Platform) { }
async ngOnInit() {
// Since ngOnInit() is executed before `deviceready` event,
// you have to wait the event.
await this.platform.ready();
await this.loadMap();
}
loadMap() {
let HND_AIR_PORT = {lat: 35.548852, lng: 139.784086};
let SFO_AIR_PORT = {lat: 37.615223, lng: -122.389979};
let HNL_AIR_PORT = {lat: 21.324513, lng: -157.925074};
let AIR_PORTS = [
HND_AIR_PORT,
HNL_AIR_PORT,
SFO_AIR_PORT
];
this.map = GoogleMaps.create('map_canvas', {
camera: {
target: AIR_PORTS
}
});
let polyline: Polyline = this.map.addPolylineSync({
points: AIR_PORTS,
color: '#AA00FF',
width: 10,
geodesic: true,
clickable: true // clickable = false in default
});
polyline.on(GoogleMapsEvent.POLYLINE_CLICK).subscribe((params: any) => {
let position: LatLng = <LatLng>params[0];
let marker: Marker = this.map.addMarkerSync({
position: position,
title: position.toUrlValue(),
disableAutoPan: true
});
marker.showInfoWindow();
});
}
}