在openlayers 2中强制更新ScaleLine Control

时间:2018-01-07 17:58:02

标签: javascript cordova openlayers

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

在大多数情况下都可以正常工作,但是当我放大和缩小一次时(我的手指放在触摸屏上),有时缩放线会停止更新。移动地图并放大/缩小一些通常会重新开始。

我的问题是:有没有办法强制ScaleLine控件重绘(除了在屏幕上移动和随机放大/缩小)。比如,有没有我可以运行的功能,比如点击按钮强制重绘?

我试过

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

但它不起作用

谢谢!

PS: 我试过从桌面上的chrome打开应用程序,因为我没有触摸屏功能,我无法重现错误

2 个答案:

答案 0 :(得分:1)

通过查看OpenLayers.debug.js,我可以看到scaleline在“moveend”事件中更新,该事件仅在触摸完成时触发(如果用户不让触摸拖动完成,则不会触发该事件通过缩放)

“move”总是触发,所以我通过在“移动”事件上触发“moveend”来解决它。

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

它删除了仅在“moveend”上添加某些事件的细节,但它解决了问题。如果您有更好的解决方案,请发表评论!

答案 1 :(得分:0)

@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");
        }
    });

  },