luc*_*cas 3 javascript google-maps google-maps-api-3
我有一个侧边栏,显示谷歌地图当前地图视图中标记的名称.侧边栏内容随着地图的移动而变化:
google.maps.event.addListener(map, 'bounds_changed', function() {
document.getElementById("list").innerHTML = "";
var mklen = mkrs.length,
a = 0,
bnds = map.getBounds();
for (a; a < mklen; a++) {
var themk = mkrs[a];
if (bnds.contains(themk.getPosition())) {
var myli = document.createElement("li");
myli.innerHTML = themk.title;
document.getElementById("list").appendChild(myli);
}
}
});
Run Code Online (Sandbox Code Playgroud)
这工作正常,但问题是bounds.contains()是非常严格的 - 如果只是标记的底部尖端在地图上(即,你看不到它的99%)它会在侧边栏上列出.我想要的是只有完全显示的标记通过该测试.
我可以想到几种方法,我无法相信其他人没有遇到过这个问题,所以我想知道是否存在以下偏好:
fromDivPixelToLatLng),然后检查ne和sw角落是否在边界内,如果是,则列出项目在你提出要求之前,我没有尝试过其中任何一种 - 我更倾向于寻求最佳甚至可能的建议,或者是否有其他方法可以做到这一点.如果它澄清的话,这是展示这个问题的小提琴
luc*_*cas 13
如果有人后来发现这个,我最终重新计算了界限 - 这似乎是涉及最少开销的方法.这是功能:
function paddedBounds(npad, spad, epad, wpad) {
var SW = map.getBounds().getSouthWest();
var NE = map.getBounds().getNorthEast();
var topRight = map.getProjection().fromLatLngToPoint(NE);
var bottomLeft = map.getProjection().fromLatLngToPoint(SW);
var scale = Math.pow(2, map.getZoom());
var SWtopoint = map.getProjection().fromLatLngToPoint(SW);
var SWpoint = new google.maps.Point(((SWtopoint.x - bottomLeft.x) * scale) + wpad, ((SWtopoint.y - topRight.y) * scale) - spad);
var SWworld = new google.maps.Point(SWpoint.x / scale + bottomLeft.x, SWpoint.y / scale + topRight.y);
var pt1 = map.getProjection().fromPointToLatLng(SWworld);
var NEtopoint = map.getProjection().fromLatLngToPoint(NE);
var NEpoint = new google.maps.Point(((NEtopoint.x - bottomLeft.x) * scale) - epad, ((NEtopoint.y - topRight.y) * scale) + npad);
var NEworld = new google.maps.Point(NEpoint.x / scale + bottomLeft.x, NEpoint.y / scale + topRight.y);
var pt2 = map.getProjection().fromPointToLatLng(NEworld);
return new google.maps.LatLngBounds(pt1, pt2);
}
Run Code Online (Sandbox Code Playgroud)
你这样称呼它:
var padbnds = paddedBounds(50, 70, 100, 30);
Run Code Online (Sandbox Code Playgroud)
分别指定地图的北,南,东和西边缘所需的填充量
| 归档时间: |
|
| 查看次数: |
5333 次 |
| 最近记录: |