我希望能够在调用后向地图视图添加填充map.fitBounds() https://developers.google.com/maps/documentation/javascript/reference，因此无论地图控件或打开时会覆盖标记的滑动面板之类的东西如何，所有标记都是可见的。传单上有一个向 fitBounds 添加填充的选项 http://leafletjs.com/reference.html#map-fitboundsoptions，但 Google 地图没有。
有时，最北的标记部分隐藏在视口上方。最西边的标记也经常位于缩放滑块下方。使用 API 2，可以通过减少地图视口中给定的填充来形成虚拟视口，然后调用该方法showBounds()基于该虚拟视口计算并执行缩放和居中：
map.showBounds(bounds, {top:30,right:10,left:50});
可以找到 API 2 的工作示例here http://koti.mbnet.fi/ojalesa/exam/index.html在 showBounds() 示例链接下。
我在 API V3 中找不到类似的功能，但希望有另一种方法可以实现这一点。也许我可以抓住东北点和西南点，然后添加假坐标以在包含它们后进一步扩展边界？
UPDATE
(Codepen http://codepen.io/dandv/pen/QGWPzP如果下面的代码不起作用）
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
draggable: true,
streetViewControl: false,
zoomControl: false
});
var marker1 = new google.maps.Marker({
position: {lat: 37, lng: -121},
map: map,
});
var marker2 = new google.maps.Marker({
position: {lat: 39.3, lng: -122},
map: map,
});
var bounds = new google.maps.LatLngBounds();
bounds.extend(marker1.position);
bounds.extend(marker2.position);
map.fitBounds(bounds);
}
#map {
height: 640px;
width: 360px;
}
#overlays {
position: absolute;
height: 50px;
width: 340px;
background: white;
margin: -80px 10px;
text-align: center;
line-height: 50px;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Simple markers</title>
</head>
<body>
<div id="map"></div>
<div id="overlays">Controls / Order pizza / ETA / etc.</div>
<script async defer
src="https://maps.googleapis.com/maps/api/js?&callback=initMap">
</script>
</body>
</html>
问题是这样的：
我尝试添加一个控件，如下所示自定义控件 https://developers.google.com/maps/documentation/javascript/controls#CustomControls，但地图并没有完全意识到这一点 - 请参阅这把小提琴 https://jsfiddle.net/dandv/pn66Lfcz/分叉自地图自定义控件示例 https://developers.google.com/maps/documentation/javascript/examples/control-custom。其中一个标记仍然被控件遮挡。
这是某种黑客解决方案，但之后fitBounds，您可以缩小一级，以便为标记获得足够的填充。
Assume map变量是您对地图对象的引用；
map.setZoom(map.getZoom() - 1);
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
