平移气泡

Question

当有区域在地图视图之外时，是否有一种方法可以在当前视图中平移气泡？

例如，https://dev2.gruppenunterkuenfte.de/nordrhein-westfalen__r187.html?vs=1

您可以单击边缘的气泡，然后就可以看到外面的气泡。

使用谷歌：https://www.gruppenunterkuenfte.de/nordrhein-westfalen__r187.html?vs=1

将在完整视图中自动平移...

致敬Chris

Answer 1

可能不是现成的，但在打开气泡和移动地图中心时，可以执行以下操作来检查。

    var checkBubble = function(evt) {
    setTimeout(function() {
        if(infoBubble && infoBubble.getState() == "open"){
            var border = 50;
            var objRect = infoBubble.getContentElement().parentElement.getBoundingClientRect();
            var objStyleRight = Math.abs(parseInt(infoBubble.getContentElement().parentElement.style.right));
            objStyleRight = objStyleRight ? objStyleRight : 0;

            var mapRect = map.getElement().getBoundingClientRect();
            var shiftX = 0;
            var shiftY = 0;

            // check, if infobubble isn't too far to up
            if ((objRect.top-border)  < mapRect.top)  {
                shiftY = (mapRect.top - (objRect.top-border));
            }

            // check, if infobubble isn't too far to the left
            var objLeft = (objRect.left - objStyleRight);
            if ((objLeft-border) < mapRect.left) {
                shiftX = (mapRect.left - (objLeft-border));
            } // check, if infobubble isn't too far to the right
            else if ((objRect.right+border) > mapRect.right) {
                shiftX = -(objRect.right - (mapRect.right-border));
            }


            if ((shiftX == 0) && (shiftY == 0)) {
                return;
            }

            var currScreenCenter = map.geoToScreen(map.getCenter());
            var newY = (currScreenCenter.y - shiftY);
            var newX = (currScreenCenter.x - shiftX);

             var newGeoCenter = map.screenToGeo(newX, newY);
             map.setCenter(newGeoCenter, true); 
        }


     }, 20);
}

map.addEventListener("mapviewchange",checkBubble);

Answer 2

非常感谢，效果很好！我将扩展到气泡在外面底部的情况：

..。

                    // check, if infobubble isn't too far to up
                    if ((objRect.top-border)  < mapRect.top)  {
                        shiftY = (mapRect.top - (objRect.top-border));
                    } else {
                        if ((objRect.bottom+border) > mapRect.bottom) {
                            shiftY = -(objRect.bottom - (mapRect.bottom-border));
                        }
                    }

..。

致敬Chris