谷歌地图标记更新点击Div

时间:2015-08-19 11:16:08

标签: angularjs google-maps animation marker ng-map

我是谷歌地图的新手。现在我使用ng-map和angularjs。当我点击div时,我发现很难将制作动画(如弹跳)。谁能告诉我怎么办?

1 个答案:

答案 0 :(得分:2)

我写了一个如何通过单击Div元素来设置标记动画的示例(请参阅地图下的div,其中包含文本“Div元素 - 单击我以切换标记动画!”)。它可以在这里找到:

http://plnkr.co/edit/KATXex?p=preview

为标记设置动画的代码如下:

if (marker.getAnimation() !== null) {
  marker.setAnimation(null);
} else {
  marker.setAnimation(google.maps.Animation.BOUNCE);
}

请注意,要使其正常工作,我必须在“on”事件中将标记的动画属性设置为null,例如

$scope.$on('mapInitialized', function(evt, evtMap) {
 map = evtMap;

 var mapMarker =  map.markers[0];
 mapMarker.setAnimation(null);
 marker = mapMarker;
});

默认情况下它是未定义的,这意味着如果没有这一步,你通常必须两次点击标记,一次将动画设置为空,第二次设置动画,例如到BOUNCE。 “未定义”的问题可能是ng-maps库的问题。