禁用谷歌地图V3上的拖动惯性/动量

Question

禁用谷歌地图V3上的拖动惯性/动量

google-mapsgoogle-maps-api-3

9

有没有办法在Google Maps V3上禁用拖动惯性？看起来应该是一个MapOption，但我找不到任何方法来实现这一点。

- pixelfreak

我猜这是一个已知的问题，没有解决方案？ - pixelfreak

6个回答

4

使用未记录的选项 disablePanMomentum 例如：

new google.maps.Map(document.getElementById(id), {
    disablePanMomentum: true,
    backgroundColor: 'none',
    disableDefaultUI: true,
    center: {
        lat: 40.674,
        lng: -73.945
    },
    zoom: 2,
    ...

- Orwellophile

不错。我很好奇你是怎么发现它的。 - Pedro Adame Vergara

1

@PedroAdameVergara 选择你喜欢的方式：深入的逆向工程或基本的正则表达式技能。 - Orwellophile

@Orwellophile能否解释一下如何使用正则表达式来找到这个结果？我很想知道，谢谢。 - Tom_B

2

目前 Maps API V3 无法实现此功能。请考虑在此处提交功能请求：http://code.google.com/p/gmaps-api-issues/。

- plexer

0

我相信至少可以抵消这种动量。如果我错了，请有人纠正我！为了简单起见，例如，假设您的地图容器具有100vw的width和100vh的height。您只需在由mouseup事件调用的函数中调用getCenter()，然后使用这些坐标立即调用setCenter()？

function initMap(){

    ...

    var win = window;
    google.maps.event.addDomListener(win, 'mouseup', setCoords);
    function setCoords(){
        var x = myMap.getCenter();
        var lat = x.lat();
        var lng = x.lng();
        myMap.addListener('center_changed', function(lat, lng){
        myMap.setCenter(new google.maps.LatLng(lat, lng));
    };
};

上面的代码实际上是可行的，但问题在于它仅在浏览器似乎过载并产生错误Uncaught RangeError: Maximum call stack size exceeded之前有效一次。

现在不确定该怎么办。

关于此更多信息，请单击此处。

- user2230470

center_changed监听器设置地图中心，触发center_changed事件，从而创建一个无限循环。 - geocodezip

@geocodezip 感谢您的回复。是的，你说得对。我在一段时间前就意识到了这一点。有趣的是，你会期望它能够无缝地工作，而不需要添加 myMap.addListener... 但实际上并不是这样。它的功能就像代码根本不存在一样。请查看我的其他线程。http://stackoverflow.com/questions/39626454/functions-uncaught-rangeerror-maximum-call-stack-size-exceeded-with-google-m - user2230470

0

这个对我来说完全没问题：

map.addListener("dragend", () => map.setCenter(map.getCenter()));

- rtf_leg

0

我通过结合这两个事件来解决我的项目中的这个问题：

dragend
idle

在有动力的情况下，idle按预期工作，当地图在平移或缩放后变为静止时触发。

let dragFinished = false;

map.addListener("dragend", () => {
  dragFinished = true;
});

map.addListener("idle", () => {
  // idle could be fired after zooming also, but we need to catch it only after drag
  if (dragFinished) {
    dragFinished = false;
    const loc = map.getCenter()?.toJSON();
    if (!loc) {
      return;
    }
    // Call your handler here!
    onDragEnd(loc);
  }
});

- Andrew K

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- EdgeCaseBerg · Accepted Answer

我今天也遇到了同样的问题，需要重新定位一些浮动在地图上方的自定义Div，在地图移动时进行重新定位。只要用户在松开鼠标前完全停止拖动（没有动力），我的重新定位就能正常工作，但是如果快速拖动并释放，则Div位置会稍有偏差。

为了解决这个问题，我钩取了拖动事件和空闲事件：

var map = /* All the map config */
var stickyCenter = map.getCenter();
/* ... Code ... */
google.maps.event.addListener(map, 'drag', function(){ stickyCenter = map.getCenter(); });
google.maps.event.addListener(map, 'idle', function() { map.setCenter(stickyCenter); });

发生的情况是当你拖动地图并且地图停止后（惯性消失后），地图会“捕捉”回原位。

如果捕捉过于突然，可以使用panTo或以某种方式动画化移动。希望这可以帮到你，虽然不完美，但这是将拖动事件的动量反转的一种方法。