[英]Google Map Issue - Ionic 2
Google map shows in the browser but when I run command ionic run android
it build successfully and launch the app but everything works fine except Google map there are no errors in chrome://inspect
it just says DEVICE READY FIRED AFTER 630 ms
but no error for google map. 谷歌地图显示在浏览器中,但是当我运行命令ionic run android
它可以成功构建并启动应用程序,但是除谷歌地图之外,其他一切都正常, chrome://inspect
中没有错误,只是说DEVICE READY FIRED AFTER 630 ms
对于谷歌地图。 I did register app on console.developers.google.com got the key and using it in www/index.html
in the head but still no changes. 我确实在console.developers.google.com上注册了应用程序,并获得了密钥并在www/index.html
中使用了它,但仍然没有任何更改。 Please help thank you. 请帮忙谢谢。 home.ts
(Map function is inside of this file) home.ts
(映射功能在此文件内部)
// Get the current location
Geolocation.getCurrentPosition().then((position) => {
// Set latitude and longtitude variable
this.lat = position.coords.latitude;
this.long = position.coords.longitude;
// This function will get the name of the city where user is located
this.getCityName(this.lat, this.long);
// this function sets up the google map
let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
let mapOptions = {
center: latLng,
zoom: 11,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var mapi = new google.maps.Map(this.mapDiv.nativeElement, mapOptions);
// Below code is provided by a ai pollution control website (http://aqicn.org/faq/2015-09-18/map-web-service-real-time-air-quality-tile-api/)
// haven't changed anything in below code copied as it is from web
var waqiMapOverlay = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return 'http://tiles.aqicn.org/tiles/usepa-aqi/' + zoom + "/" + coord.x + "/" + coord.y + ".png?token=_TOKEN_ID_";
},
name: "Air Quality",
});
// Insert above received data into map
mapi.overlayMapTypes.insertAt(0,waqiMapOverlay);
` `
Probably your map is not getting coordinates(position.coords.latitude, position.coords.longitude) , that's why your map is not rendering. 可能您的地图没有获得坐标(position.coords.latitude,position.coords.longitude),这就是为什么您的地图没有渲染。 try with navigator.Geoloaction.getCurrentPosition... or check if any plugin is required to get user geolocation. 请尝试使用navigator.Geoloaction.getCurrentPosition ...或检查是否需要任何插件才能获得用户地理位置信息。 & prefer to give some fallback coordinates. 并希望提供一些后备坐标。
this.lat = position.coords.latitude || "21.1610858";
this.long = position.coords.longitude || "79.0725101";
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.