Как перенести маркер на карту google

Я изучаю API Карт Google и пытаюсь переместить объект на карту. Я создал тестовую страницу, которая показывает маркер при запуске, но после вызова функции, которая увеличивает долготу, он удаляет маркер с карты. В консоли нет ошибок. Может кто-то посмотреть на мой код и помочь мне понять, почему это происходит? Javascript Файл:Как перенести маркер на карту google

var app = angular.module('angularGoogleMapsTestApp', ['uiGmapgoogle-maps']); 

var increment = 2.02; 
var startingLongitude = -122.44; 
var startingLatitude = 37.769; 

    app.controller('angularGoogleMapCtrl', function ($scope, $log, $rootScope) { 

$scope.map = {center: {latitude: 37.7699298, longitude: -122.4469157}, zoom: 12}; 
$scope.markers = []; 

$scope.removeMarkers = function() { 
    $scope.markers = []; 
} 

function init() { 
    $scope.markers.push(
      { 
       id: 0, 
       latitude: startingLatitude, 
       longitude: startingLongitude 
      }); 

    $log.info(JSON.stringify($scope.markers)); 
} 

$scope.moveMarker = function() { 
    var old = $scope.markers[0].longitude; 
    $scope.markers.splice(0, 1); 
    $scope.markers.push(
      { 
       id: 0, 
       latitude: startingLatitude, 
       longitude: (old + increment) 
      }); 
    $log.info(JSON.stringify($scope.markers)); 
}; 

    init(); 

});

и HTML:

<!DOCTYPE html> 
<head> 
<meta charset="utf-8"> 
<title>ngMap Tests</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<script src="bower_components/angularjs/angular.js"></script> 
<script src="bower_components/lodash/dist/lodash.js"></script> 
<script src='bower_components/angular-google-maps/dist/angular- google-maps.js'></script> 
<script src="angularGoogleMapsTestApp.js"></script> 
<style> 
    .angular-google-map-container { height: 400px; } 

</style> 
</head> 
<body ng-app="angularGoogleMapsTestApp"> 
<h3>Angular Google Maps Test</h3> 

<p>Test showing adding and removing markers on Angular Google Maps 
    (from: <a href="http://angular-ui.github.io/angular-google-maps/#!/"> 
     Angular Google Maps</a>)</p> 

<div ng-controller="angularGoogleMapCtrl"> 
    <input ng-click="moveMarker()" type="button" value="moveMarker"> 
    <input ng-click="removeMarkers()" type="button" value="Remove markers"> 

    <div style="height:500px"> 
     <ui-gmap-google-map center='map.center' zoom='map.zoom'> 
      <ui-gmap-markers models="markers" coords="'self'" modelsbyref="false"/> 
     </ui-gmap-google-map> 
    </div> 
    </div> 
    </body> 
    </html>

источник

2016-07-21 Anonymous

Если вы используете Угловой Google Maps v1.2.0 или выше, ваши объекты маркерных требует idKey, described here in the docs. Вы можете изменить текущий id ключ с idKey так:

$scope.markers.push({ 
    idKey: 0, 
    latitude: startingLatitude, 
    longitude: startingLongitude 
});

источник

2016-07-21 17:27:18

он не работает с IdKey –

Как перенести маркер на карту google

ответ

Смежные вопросы