我在error
设备上获得了以下android
,我的应用崩溃了。
这是我的完整代码:
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Geolocation ,GeolocationOptions } from '@ionic-native/geolocation';
import {
GoogleMaps,
GoogleMap,
GoogleMapsEvent,
LatLng,
CameraPosition,
MarkerOptions,
Marker
} from '@ionic-native/google-maps';
@IonicPage()
@Component({
selector: 'page-google-map-test',
templateUrl: 'google-map-test.html',
})
export class GoogleMapTestPage {
constructor(...,public googleMaps: GoogleMaps,private geolocation : Geolocation) {
}
ionViewDidLoad() {
this.mapHandler2();
}
mapHandler2(){
// create a new map by passing HTMLElement
let element: HTMLElement = document.getElementById('map');
let map: GoogleMap = this.googleMaps.create(element);
let LatLang: LatLng = new LatLng(43.0741904,-89.3809802);
// create CameraPosition
let position: any = {
target: LatLang,
zoom: 18,
tilt: 30
};
map.one(GoogleMapsEvent.MAP_READY).then(() => {
console.log('Map is ready!');
// Now you can add elements to the map like the marker
map.moveCamera(position);
// create new marker
let markerOptions:any = {
position: LatLng,
title: 'Ionic'
};
const marker:any = map.addMarker(markerOptions)
.then((marker: Marker) => {
marker.showInfoWindow();
});
this.geolocation.getCurrentPosition().then((position) => {
let LatLang: LatLng = new LatLng(position.coords.latitude,position.coords.longitude);
map.setCameraTarget(LatLang);
map.setCameraZoom(18);
// create new marker
let markerOptions:any = {
position: LatLng,
title: 'You Are Here'
};
const marker:any = map.addMarker(markerOptions)
.then((marker: Marker) => {
marker.showInfoWindow();
});
}, (err) => {
console.log(err);
alert('location error');
});
}); // End of GoogleMapsEvent.MAP_READY
}
}
最初加载map canvas
但崩溃显示上述屏幕。
请帮我解决这个问题,我对离子3很新。
答案 0 :(得分:0)
我在这里面临着同样的问题。在尝试了几种绘制标记的方式后,我只是发现当我在可见区域之外添加标记时,应用程序崩溃了。然后,我将初始地图配置更改为远距缩放设置(在我的情况下,我将缩放比例从13设置为缩放比例4),并且仅在绘制了所有标记后,才将缩放设置为近似于所需标记。我猜您还可以在初始配置中设置所有标记的latLng数组,然后再进行绘制,因此会将摄像机调整为这些标记,并且它们都位于可见区域。