在 openlayers 2 中强制更新 ScaleLine 控件

Question

我正在使用 Openlayers 2 并正在创建一个地图应用程序。我正在使用 apache cordova，所以它只是 javascript/html/css.

它在大多数情况下工作正常，但当我放大和缩小很多次（用我的手指在触摸屏上）时，比例线有时会停止更新。移动地图并放大 in/out 一些通常会重新开始。

我的问题是：有没有办法强制重绘 ScaleLine 控件（除了在屏幕上移动和随机缩放 in/out 之外）。比如，有没有我可以运行的功能，比如说，单击按钮强制重绘？

我试过了

map.Control.Scaleline.update();
map.Control.Scaleline.draw();

但是不行

谢谢！

PS: 我尝试在桌面上从 chrome 打开应用程序，但由于我没有触摸屏功能，因此无法重现错误

Answer 1

通过查看 OpenLayers.debug.js 我可以看到比例线在 "moveend" 事件中更新，该事件仅在触摸完成时触发（如果用户不让触摸则不会触发）例如通过缩放拖动完成）

"move" 总是触发，所以我通过在 "move" 事件上触发 "moveend" 来解决它。

    map.events.on ({
        "move": function () {
                map.events.triggerEvent("moveend");
            }
        }
    });

它删除了仅在 "moveend" 上添加某些事件的细节，但它解决了问题。如果您有更好的解决方案请评论！

Answer 2

@atwinther 几乎是正确的。解决方案是监视 "touchend"，然后发送一个 moveend 事件。然而，只有最新的浏览器支持这一点，因此对于某些人来说它可能仍然存在问题。至少，根据 Mozilla 的说法，这应该适用于最新的 Firefox 和 Chrome：https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent

这是我所做的工作，省略了非必要代码：

var SYP = {
  init: function() {
    this.map = new OpenLayers.Map("map");

    // workaround for ol2 bug where touch events do not redraw the          
    // graticule or scaleline                                               
    this.map.events.on ({
        "touchend": function () {
            SYP.map.events.triggerEvent("moveend");
        }
    });

  },

在 openlayers 2 中强制更新 ScaleLine 控件

Force update of ScaleLine Control in openlayers 2

javascript

openlayers

cordova