1

我正在使用WebViewjdk-8u45 中包含的 JavaFX 打开一个网页，该网页显示使用 OpenLayers 2.13.1 的地图。我正在尝试使用 aZoomBox和 a放大地图BoxHandler。缩放工作正常，但问题是矩形是如何绘制的。

想要的结果是，一旦我单击地图并开始拖动，矩形应该在我移动鼠标时开始绘制。这在所有浏览器中都可以正常工作，除了我的WebView. 发生的情况是，只有在我将鼠标在 x 和 y 方向（例如对角线）移动几厘米之后，矩形才会从这个位置开始绘制（不是我开始拖动的那个位置）。我查看了来自不同鼠标事件的坐标，它们似乎都是正确的，这可以通过它放大我实际拖动的区域（例如，不是绘制的区域）这一事实来证实。

console.log从我单击地图的那一刻起，JavaScript stmts 输出坐标，但在拖动开始时没有绘制任何内容。

有没有人遇到过类似的问题WebView？正如我所说，该代码在我尝试过的所有其他浏览器（Safari、Firefox、Chrome、IE）中都非常有效。我在互联网上四处寻找，但我无法找到我的问题的答案。

代码取自BoxHandler.js：

startBox: function (xy) {
    ;;;console.log(xy);
    ;;;console.log("startbox xy=" + xy.x + "," + xy.y);
    if(this.zoomBox){
        this.removeBox();
    }

    this.zoomBox = OpenLayers.Util.createDiv('zoomBox',
                                             this.dragHandler.start);
    this.zoomBox.className = this.boxDivClassName;
    this.zoomBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
    this.map.viewPortDiv.appendChild(this.zoomBox);

    OpenLayers.Element.addClass(
        this.map.viewPortDiv, "olDrawBox"
    );
},

/**
* Method: moveBox
*/
moveBox: function (xy) {

    var startX = this.dragHandler.start.x;
    var startY = this.dragHandler.start.y;

    ;;;console.log("dragHandler.start.x=" + this.dragHandler.start.x);
    ;;;console.log("dragHandler.start.y=" + this.dragHandler.start.y);

    var deltaX = Math.abs(startX - xy.x);
    var deltaY = Math.abs(startY - xy.y);
    this.zoomBox.style.width = Math.max(1, deltaX) + "px";
    this.zoomBox.style.height = Math.max(1, deltaY) + "px";
    this.zoomBox.style.left = xy.x < startX ? xy.x+"px" : startX+"px";
    this.zoomBox.style.top = xy.y < startY ? xy.y+"px" : startY+"px";

    console.log("zoombox width=" + this.zoomBox.style.width);
    console.log("zoombox height=" + this.zoomBox.style.height);
    console.log("zoombox left=" + this.zoomBox.style.left);
    console.log("zoombox top=" + this.zoomBox.style.top);

    // depending on the box model, modify width and height to take borders
    // of the box into account
    var box = this.getBoxCharacteristics();
    ;;;console.log("movebox xOffset=" + box.xOffset);
    ;;;console.log("movebox yOffset=" + box.yOffset);
    if (box.newBoxModel) {
        if (xy.x > startX) {
            this.zoomBox.style.width =
                Math.max(1, deltaX - box.xOffset) + "px";
        }
        if (xy.y > startY) {
            this.zoomBox.style.height =
                Math.max(1, deltaY - box.yOffset) + "px";
        }
    }
},

/**
* Method: endBox
*/
endBox: function(end) {
    var result;
    console.log(this.map.viewPortDiv.lastElementChild.style);
    if (Math.abs(this.dragHandler.start.x - end.x) > 5 ||
        Math.abs(this.dragHandler.start.y - end.y) > 5) {
        var start = this.dragHandler.start;
        var top = Math.min(start.y, end.y);
        var bottom = Math.max(start.y, end.y);
        var left = Math.min(start.x, end.x);
        var right = Math.max(start.x, end.x);
        result = new OpenLayers.Bounds(left, bottom, right, top);
    } else {
        result = this.dragHandler.start.clone(); // i.e. OL.Pixel
    }
    this.removeBox();

    this.callback("done", [result]);
}

另外，我不知道这是否相关，但是当我检查div保存地图的 HTML 元素（使用 Firebug Lite）时，它的顶部边框看起来div比它应该的要低。地图（在网页上的正确位置）超出了顶部边界。这与我提到的其他浏览器中的行为不同。

任何帮助，将不胜感激。

4

0 回答 0