假设你有一个矩形 windowArea
,它保存绘图区域的坐标(例如网页浏览器窗口区域的像素值)。例如,如果你正在整个屏幕上绘制地图,并且左上角的坐标为 (0, 0),那么该矩形将具有以下值:
windowArea.top = 0;
windowArea.left = 0;
windowArea.right = maxWindowWidth;
windowArea.bottom = maxWindowHeight;
您还需要了解可见地图片段,这将是经度和纬度范围,例如:
mapArea.top = 8.00; //lat
mapArea.left = 51.00; //lng
mapArea.right = 12.00; //lat
mapArea.bottom = 54.00; //lng
缩放时重新计算地图区域:
mapArea.left = mapClickPoint.x - (windowClickPoint.x- windowArea.left) * (newMapWidth / windowArea.width());
mapArea.top = mapClickPoint.y - (windowArea.bottom - windowClickPoint.y) * (newMapHeight / windowArea.height());
mapArea.right = mapArea.left + newWidth;
mapArea.bottom = mapArea.top + newHeight;
mapClickPoint
保存鼠标指针下地图坐标(经度,纬度)。
windowClickPoint
保存鼠标指针下的窗口坐标(像素)。
newMapHeight
和 newMapWidth
保存缩放后可见地图片段的新范围:
newMapWidth = zoomFactor * mapArea.width;//lets say that zoomFactor = <1.0, maxZoomFactor>
newMapHeight = zoomFactor * mapArea.height;
当您拥有新的mapArea
值时,您需要将其拉伸以覆盖整个windowArea
,这意味着mapArea.top/left
应绘制在windowArea.top/left
处,mapArea.right/bottom
应绘制在windowArea.right/bottom
处。
我不确定Google地图是否使用相同的算法,它提供了类似的结果并且非常灵活,但是您需要知道窗口坐标和某种可见对象部分的坐标,这些将被缩放。
![image](https://istack.dev59.com/fxPPD.webp)