nee*_*zer 5 javascript google-maps google-maps-api-3 google-maps-markers
我知道我可以在谷歌地图上添加标记的动画,la https://developers.google.com/maps/documentation/javascript/overlays#MarkerAnimations
无论如何我可以做反向动画从地图中删除标记吗?我希望它能够在删除标记时飞回地图的顶部......这可能吗?
这是我到目前为止的删除代码(只是从地图中删除它,没有动画):
// TODO figure out if there is a way to animate this removal, like the add
$.contextualMap.prototype.removeMarker = function(m) {
m.mapMarker.setMap(null);
m.mapMarker = null;
};
Run Code Online (Sandbox Code Playgroud)
Eng*_*eer 12
由于google.maps.Animation不支持丢弃的反向动画,因此您需要编写自己的脚本来为标记设置动画.
你可以写这样的东西:
function removeMarkerWithAnimation(map, marker){
(function animationStep(){
//Converting GPS to World Coordinates
var newPosition = map.getProjection().fromLatLngToPoint(marker.getPosition());
//Moving 10px to up
newPosition.y -= 10 / (1 << map.getZoom());
//Converting World Coordinates to GPS
newPosition = map.getProjection().fromPointToLatLng(newPosition);
//updating maker's position
marker.setPosition( newPosition );
//Checking whether marker is out of bounds
if( map.getBounds().getNorthEast().lat() < newPosition.lat() ){
marker.setMap(null);
}else{
//Repeating animation step
setTimeout(animationStep,10);
}
})();
}
Run Code Online (Sandbox Code Playgroud)
这是DEMO:
| 归档时间: |
|
| 查看次数: |
2952 次 |
| 最近记录: |