Google Map API v3 – 设置边界和中心
我最近切换到Google Maps API V3。 我正在做一个简单的例子，从数组中绘制标记，但是我不知道如何自动对标记进行居中和缩放。
我search了networking的高低，包括谷歌自己的文档，但还没有find明确的答案。 我知道我可以简单地取坐标的平均值，但是如何设定相应的缩放比例呢？
function initialize() { var myOptions = { zoom: 10, center: new google.maps.LatLng(-33.9, 151.2), mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); setMarkers(map, beaches); } var beaches = [ ['Bondi Beach', -33.890542, 151.274856, 4], ['Coogee Beach', -33.423036, 151.259052, 5], ['Cronulla Beach', -34.028249, 121.157507, 3], ['Manly Beach', -33.80010128657071, 151.28747820854187, 2], ['Maroubra Beach', -33.450198, 151.259302, 1] ]; function setMarkers(map, locations) { var image = new google.maps.MarkerImage('images/beachflag.png', new google.maps.Size(20, 32), new google.maps.Point(0,0), new google.maps.Point(0, 32)); var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png', new google.maps.Size(37, 32), new google.maps.Point(0,0), new google.maps.Point(0, 32)); var lat = map.getCenter().lat(); var lng = map.getCenter().lng(); var shape = { coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly' }; for (var i = 0; i < locations.length; i++) { var beach = locations[i]; var myLatLng = new google.maps.LatLng(beach[1], beach[2]); var marker = new google.maps.Marker({ position: myLatLng, map: map, shadow: shadow, icon: image, shape: shape, title: beach[0], zIndex: beach[3] }); } } 是的，只需声明你的新边界对象。
var bounds = new google.maps.LatLngBounds();
然后为每个标记，扩展你的边界对象：
bounds.extend(myLatLng); map.fitBounds(bounds);
API： google.maps.LatLngBounds
得到的一切sorting – 请参阅最后几行代码 – （ bounds.extend(myLatLng); map.fitBounds(bounds); ）
function initialize() { var myOptions = { zoom: 10, center: new google.maps.LatLng(0, 0), mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map( document.getElementById("map_canvas"), myOptions); setMarkers(map, beaches); } var beaches = [ ['Bondi Beach', -33.890542, 151.274856, 4], ['Coogee Beach', -33.923036, 161.259052, 5], ['Cronulla Beach', -36.028249, 153.157507, 3], ['Manly Beach', -31.80010128657071, 151.38747820854187, 2], ['Maroubra Beach', -33.950198, 151.159302, 1] ]; function setMarkers(map, locations) { var image = new google.maps.MarkerImage('images/beachflag.png', new google.maps.Size(20, 32), new google.maps.Point(0,0), new google.maps.Point(0, 32)); var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png', new google.maps.Size(37, 32), new google.maps.Point(0,0), new google.maps.Point(0, 32)); var shape = { coord: [1, 1, 1, 20, 18, 20, 18 , 1], type: 'poly' }; var bounds = new google.maps.LatLngBounds(); for (var i = 0; i < locations.length; i++) { var beach = locations[i]; var myLatLng = new google.maps.LatLng(beach[1], beach[2]); var marker = new google.maps.Marker({ position: myLatLng, map: map, shadow: shadow, icon: image, shape: shape, title: beach[0], zIndex: beach[3] }); bounds.extend(myLatLng); } map.fitBounds(bounds); }
我的谷歌地图api v3的build议是（不要认为它可以做得更有效）：
gmap : { fitBounds: function(bounds, mapId) { //incoming: bounds - bounds object/array; mapid - map id if it was initialized in global variable before "var maps = [];" if (bounds==null) return false; maps[mapId].fitBounds(bounds); } }
在结果u将适合您的地图窗口中的所有点的边界。
例子完美地工作，你可以自由地在这里查看www.zemelapis.lt
答案非常适合调整标记的地图边界，但是如果您想要扩展诸如多边形和圆形等形状的Google地图边界，则可以使用以下代码：
对于圈子
bounds.union(circle.getBounds());
对于多边形
polygon.getPaths().forEach(function(path, index) { var points = path.getArray(); for(var p in points) bounds.extend(points[p]); });
对于矩形
bounds.union(overlay.getBounds());
对于多义线
var path = polyline.getPath(); var slat, blat = path.getAt(0).lat(); var slng, blng = path.getAt(0).lng(); for(var i = 1; i < path.getLength(); i++) { var e = path.getAt(i); slat = ((slat < e.lat()) ? slat : e.lat()); blat = ((blat > e.lat()) ? blat : e.lat()); slng = ((slng < e.lng()) ? slng : e.lng()); blng = ((blng > e.lng()) ? blng : e.lng()); } bounds.extend(new google.maps.LatLng(slat, slng)); bounds.extend(new google.maps.LatLng(blat, blng));
setCenter（）方法仍适用于fitBounds（）不存在的Maps API for Flash的最新版本。
使用下面的一个，
map.setCenter（bounds.getCenter（），map.getBoundsZoomLevel（bounds））;
