Question

我想获得地图的可拖动位置。我在ng-map上设置了on-dragend，但事件没有返回位置，因为地图本身没有位置。我计划在地图的中心创建隐藏的自定义标记。拖动地图时，标记也会移动/拖动。当调用on-dragend时，该隐藏自定义标记的当前位置将相应更新。

我怎样才能做到这一点？

查看

<ng-map center="{{ latitude }}, {{ longitude }}" 
          zoom="14" 
          on-dragend="dragEnd()">
    <marker icon="{{customIcon}}" position="{{ latitude }}, {{ longitude }}">
    </marker>
</ng-map>

控制器

$scope.dragEnd = function (e) {
    console.log("EVENT: " + event); // EVENT undefined
}

Answer 1

根据the documentation，dragend事件不接受任何参数：

dragend
参数：无当用户停止拖动时，会触发此事件地图。

相反，您可以考虑在拖动地图后根据当前地图属性更新标记（例如，通过使用getCenter()函数获取地图中心）：

$scope.dragEnd = function () {
   $scope.pos = [$scope.map.getCenter().lat(),$scope.map.getCenter().lng()];
};

实施例

＆＃13;

angular.module('plunker', ['ngMap'])

    .controller('MainCtrl', ['$scope', 'NgMap',
        function ($scope,NgMap) {

            NgMap.getMap().then(function (map) {
                $scope.map = map;
            });

            $scope.center = [45.026950, 15.205764];
            $scope.pos = [45.026950, 15.205764];

            $scope.dragEnd = function () {
                $scope.pos = [$scope.map.getCenter().lat(),$scope.map.getCenter().lng()];
            };

        }]);

＆＃13;

<script src="https://code.angularjs.org/1.6.0/angular.js"></script>
<script src="//maps.google.com/maps/api/js"></script>
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script>


<div ng-app="plunker" ng-controller="MainCtrl">
  <ng-map center="{{center}}" zoom="5" on-click="getpos($event)" on-dragend="dragEnd()" style='width: 100%; margin: 15px;'>
    <marker position="{{pos}}"  animation="Animation.BOUNCE" animation="DROP"></marker>
  </ng-map>
</div>

＆＃13;

NgMap可拖动的位置

1 个答案: