地理位置-使用Ionic框架、AngularJS和Google API

我们正在尝试在最新/项目中使用此功能，但似乎无法解决此问题

我们希望能够单击“查找我们”，并显示我们当前的位置

如果有人知道我们哪里出了问题，请告诉我们。 多谢各位

// Google Map
.controller('MapCtrl', function($scope, $ionicLoading, $compile) {
  function initialise() {   
    var myLatlng = new google.maps.LatLng(53.068165,-4.076803);
    var mapOptions = {
        zoom: 15, 
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
      }
    var map = new google.maps.Map(document.getElementById('map'), mapOptions);
    var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
    });
    $scope.map = map;    
  }
  google.maps.event.addDomListener(window, 'load', initialise);
  $scope.centerOnMe = function() {
    if(!$scope.map) {
      return;
    }
    $scope.loading = $ionicLoading.show({
      showBackdrop: true
    });
    navigator.geolocation.getCurrentPosition(function(pos) {
      $scope.map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
      $scope.loading.hide();
    }, 
    function(error) {
      alert('Unable to get location: ' + error.message);
    });
  };
 });

这是一款带有谷歌地图的爱奥尼亚应用程序

---

angular.module（'ionic.example'，['ionic']））
.controller（'MapCtrl'，函数（$scope、$ionicLoading、$compile）{
函数初始化（）{
var myLatlng=新的google.maps.LatLng（43.07493，-89.381388）；
变量映射选项={
中心：myLatlng，
缩放：16，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map”），
地图选项）；
//Marker+infowindow+angularjs编译并单击
var contentString=“单击我！”；
var compiled=$compile（contentString）（$scope）；
var infowindow=new google.maps.infowindow({
内容：已编译[0]
});
var marker=new google.maps.marker({
职位：myLatlng，
地图：地图，
标题：“乌卢鲁（艾尔斯岩）”
});
google.maps.event.addListener（标记'click'，函数（）{
信息窗口。打开（地图、标记）；
});
$scope.map=map；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
$scope.centerOnMe=函数（）{
if（！$scope.map）{
返回；
}
$scope.loading=$ionicLoading.show({
内容：“正在获取当前位置…”，
showbackground:错误
});
navigator.geolocation.getCurrentPosition（函数（pos））{
$scope.map.setCenter（新的google.maps.LatLng（pos.coords.lation，pos.coords.longitude））；
$scope.loading.hide（）；
}，函数（错误）{
警报（“无法获取位置：”+错误消息）；
});
};
$scope.clickTest=函数（）{
警报（'带有ng click'的信息窗口示例）
};
});

这是一个很好的例子

---

我确实为谷歌地图使用了一个指令，只是为了让一切都保持在一个角度上。

你发布的javascript/HTML对我有用（显示了一个标记）。问题必须在框架中。请在问题本身中发布相关代码，而不仅仅是指向外部资源的链接。@geocodezip在代码笔中，所有应用程序都正常工作，但是我已经编辑了我的答案，你可以看到MapCtrlWhy

navigator.geolocation.getCurrentPosition

在android emulator中不起作用？@evc你找到android的解决方案了吗？@EmptyData它起作用了，不要使用cordova插件，只要求地理位置权限，然后android将为浏览器提供本地地理位置service@evc如何在混合应用程序中请求许可？您至少需要1个插件，比如摄像头，通过cordova add plugin[名称]安装。它将被安装在plugins文件夹中，打开android.json并在相机权限之后添加权限

when you find the current location of your phone first you find out the latitude and longitude.So First,Add the plugin your project 
1.cordova plugin add cordova-plugin-geolocation

2.module.controller('GeoCtrl', function($cordovaGeolocation,$http) {

  var posOptions = {timeout: 10000, enableHighAccuracy: false};
  $cordovaGeolocation
    .getCurrentPosition(posOptions)
    .then(function (position) {
      var lat  = position.coords.latitude //here you get latitude
      var long = position.coords.longitude //here you get the longitude
  $http.get('http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat+','+long+'&sensor=true').then(function(data){      $rootScope.CurrentLocation=data.data.results[0].formatted_address;//you get the current location here


        }, function(err) {
          // error
        });
    }, function(err) {
      // error
    });

}):

.controller('MarkerRemoveCtrl', function($scope, $ionicLoading) {

  $scope.positions = [{
    lat: 43.07493,
    lng: -89.381388
  }];

  $scope.$on('mapInitialized', function(event, map) {
    $scope.map = map;
  });

  $scope.centerOnMe= function(){

    $ionicLoading.show({
      template: 'Loading...'
    });


    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
      $scope.positions.push({lat: pos.k,lng: pos.B});
      console.log(pos);
      $scope.map.setCenter(pos);
      $ionicLoading.hide();
    });

  };

});

when you find the current location of your phone first you find out the latitude and longitude.So First,Add the plugin your project 
1.cordova plugin add cordova-plugin-geolocation

2.module.controller('GeoCtrl', function($cordovaGeolocation,$http) {

  var posOptions = {timeout: 10000, enableHighAccuracy: false};
  $cordovaGeolocation
    .getCurrentPosition(posOptions)
    .then(function (position) {
      var lat  = position.coords.latitude //here you get latitude
      var long = position.coords.longitude //here you get the longitude
  $http.get('http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat+','+long+'&sensor=true').then(function(data){      $rootScope.CurrentLocation=data.data.results[0].formatted_address;//you get the current location here


        }, function(err) {
          // error
        });
    }, function(err) {
      // error
    });

}):