谷歌地图不在Android手机离子框架呈现

-1

我有一些问题显示我的Android手机上的谷歌地图。此代码工作完全在谷歌浏览器，但我得到一个白色屏幕手机谷歌地图不在Android手机离子框架呈现

这里的是我的HTML代码：

<body ng-app="starter" ng-controller="ctrl"> <ion-content> <div id="map"></div> </ion-content> </body>

而这里的JavaScript的：

app.controller('ctrl', function($scope, $ionicLoading) { 

google.maps.event.addDomListener(window, 'load', function() { 
    var myLatlng = new google.maps.LatLng(37.3000, -120.4833); 

    var mapOptions = { 
     center: myLatlng, 
     zoom: 16, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(document.getElementById("map"), mapOptions); 

    navigator.geolocation.getCurrentPosition(function(pos) { 
     map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude)); 
     var myLocation = new google.maps.Marker({ 
      position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude), 
      map: map, 
      title: "My Location" 
     }); 
    }); 

    $scope.map = map; 
});

}）;

感谢您的帮助

来源

2015-05-26 Idir

找到万一有人的解决方案有同样的问题

您需要TU使用由谷歌提供的API密钥https://developers.google.com/maps/documentation/javascript/tutorial#api_key

来源

2015-05-30 19:56:16 user4957072

添加以下

获取来自Google开发人员控制台的键

<script src="http://maps.googleapis.com/maps/api/js?key=<AIzXXXXXXXXXXXXXXX.......>&sensor=true">

HMTL：

<div id="map-canvas" data-tap-disabled="true"> 
      </div>

添加CSS：

#map { 
    display: block; 
    width: 100%; 
    height: 100%; 
} 
.scroll { 
    height: 100%; 
}

编号： https://github.com/driftyco/ionic-starter-maps

http://ngcordova.com/docs/plugins/geolocation/

来源

2017-02-10 20:56:04

谷歌地图不在Android手机离子框架呈现

回答

相关问题