【问题标题】:ngCordova getCurrentLocation causes blank google mapngCordova getCurrentLocation 导致空白谷歌地图
【发布时间】:2016-02-14 22:31:07
【问题描述】:

我知道有大量支持论坛,但似乎没有人完全知道我正在寻找的答案。所以,详细来说,下面是我的场景(我正在离子框架中开发)。

我正在使用 ngCordova cordova-plugin-geolocation 获取我当前的位置(这很好用):

function initialize(){
var posOptions = {timeout: 10000, enableHighAccuracy: false};

$cordovaGeolocation.getCurrentPosition(posOptions)
  .then(function(pos){
    var lat=pos.coords.latitude;
    var lng=pos.coords.longitude;
    var myLatlng = new google.maps.LatLng(lat,lng);
    initMap(myLatlng);
  }, function(err){
});}

我已经用上面的代码验证了 vars lat,lng 填充了正确的值。因此,接下来我要做的是渲染要显示的谷歌地图,我通过下面的 initMap 函数来实现:

function initMap(origin){
var mapOptions = {
  center: origin,
  zoom: 16,
};
$scope.map=new google.maps.Map(document.getElementById("map"),mapOptions);}

当我尝试渲染此图像时,我只收到一个空白屏幕。另外,我有 'ionic.Platform.ready(initialize);'在我的控制器代码中。

注意:以下是我的 html 模板中的代码段:

<div id="map" ng-controller="MapCtrl">
</div>

一些失败的编码尝试包括:

  1. 使用 ng-init() 而不是 ionic.Platform.ready - 相同的空白图像
  2. 使所有功能失效(绝望的尝试)- 相同的空白图像

成功的时间:

我直接用latlong google对象调用initMap,完全绕过了嵌套在initialize()函数中的“getCurrentPosition”操作。

任何建议都将不胜感激。

【问题讨论】:

  • codepen.io/ionic/pen/uzngt 这应该对你有帮助
  • 这是我使用过的链接之一...这对我没有帮助,因为此示例中未使用 $cordovaGeolocation.getCurrentPosition()。如果不使用 getCurrentPosition() 函数,我可以让它工作。
  • 仅供参考,我已将这个问题更详细地发布到另一个论坛:forum.ionicframework.com/t/…
  • 你解决了吗?
  • 我今天早上才发现...它需要使用 $q.defer 来承诺获取数据并异步返回。如果您有兴趣,我会将其作为答案发布在这里!

标签: angularjs cordova ionic-framework google-geolocation


【解决方案1】:

所以,我的初始逻辑的问题是执行 getCurrentPosition 是一个异步调用,这意味着它将在 DOM 完全加载后接收其数据。所以,为了解决这个问题,我使用 $q.defer() 创建了一个以后访问的 promise 对象。可以在我发布到的另一个论坛上找到有关如何执行此操作的更多信息:

https://forum.ionicframework.com/t/ngcordova-getcurrentposition-with-google-maps-api/44153

祝你好运,编码愉快!

【讨论】:

    猜你喜欢
    • 2017-04-26
    • 2016-01-10
    • 2018-01-14
    • 1970-01-01
    • 1970-01-01
    • 2017-04-14
    • 1970-01-01
    相关资源
    最近更新 更多