Javascript 谷歌缩放以适应该页面上的所有标记

Javascript 谷歌缩放以适应该页面上的所有标记,javascript,google-maps,Javascript,Google Maps,我很难弄明白这一点,我看了这里和互联网上的例子,但仍然无法让它发挥作用。我有一个谷歌v3地图,它显示了英国各地的许多标记。我希望能够设置缩放级别,以覆盖选定区域中的所有标记,例如,伦敦可能有50个标记,格拉斯哥可能有2个…在格拉斯哥页面上,两者具有相同的缩放级别看起来有点奇怪。我已经读了一些关于getBounds()方法的内容,但是我不确定在我的脚本中在哪里以及如何实现它。任何帮助都将不胜感激。这是到目前为止我的代码 var gmarkers=[]; var map=null; functio

我很难弄明白这一点,我看了这里和互联网上的例子,但仍然无法让它发挥作用。我有一个谷歌v3地图,它显示了英国各地的许多标记。我希望能够设置缩放级别,以覆盖选定区域中的所有标记,例如,伦敦可能有50个标记,格拉斯哥可能有2个…在格拉斯哥页面上,两者具有相同的缩放级别看起来有点奇怪。我已经读了一些关于getBounds()方法的内容,但是我不确定在我的脚本中在哪里以及如何实现它。任何帮助都将不胜感激。这是到目前为止我的代码

var gmarkers=[];
var map=null;

function initialize(){

var myOptions={

    zoom:10,<!--would this still be needed-->
    center:new google.maps.LatLng(parseFloat(gmapcentrelat),parseFloat(gmapcentrelong)),                                            mapTypeControl:true,
    mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl:true,
    mapTypeId:google.maps.MapTypeId.ROADMAP
};
        map=new google.maps.Map(document.getElementById("map_canvas"),
                                        myOptions);


        google.maps.event.addListener(map, 'click', function() {
        infowindow.close()

    });

        // Read the data from example.xml
        downloadUrl(gmapfile,function(doc){
        var xmlDoc=xmlParse(doc);
        var markers=xmlDoc.documentElement.getElementsByTagName("hotel");
        for(var i=0;i<markers.length;i++){

        // obtain the attribues of each marker
        var lat=parseFloat(markers[i].getAttribute("lat"));
        var long=parseFloat(markers[i].getAttribute("long"));
        var point=new google.maps.LatLng(lat,long);
        var star=(markers[i].getAttribute("star"));

        var star_html='';

        if(star>1)
                {star_html='<img src="" alt="star" /><br />'}

                var hotel_id=(markers[i].getAttribute("id"));
                var hotel_name=(markers[i].getElementsByTagName("given_name")[0].firstChild.nodeValue);
                var country=(markers[i].getAttribute("country_id"));
                var city=(markers[i].getAttribute("city_id"));
                var location=(markers[i].getAttribute("location"));
                var filetxt=(markers[i].getAttribute("file_name"));
                var countrytxt=(markers[i].getAttribute("country_name"));
                    countrytxt=countrytxt.toLowerCase();
                    countrytxt=countrytxt.replace(" ","_");
                var citytxt=(markers[i].getAttribute("city_name"));
                    citytxt=citytxt.toLowerCase();
                    citytxt=citytxt.replace(" ","_");

                var html='';

        // create the marker        
        var marker=createMarker(point,html,star,hotel_id)

    }
})
};

    var infowindow=new google.maps.InfoWindow(
{
        size:new google.maps.Size(150,50)
});

function myclick(i){
        google.maps.event.trigger(gmarkers[i],"click")
};

function createMarker(latlng,html,star,hotel_id){
    var contentString=html;
    var marker=new google.maps.Marker({
        position:latlng,
        map:map,

        icon:'http://'+servername+'hotels/graphics/red_'+star+'_star.png',
        zIndex:Math.round(latlng.lat()*-100000)<<5
        });

        google.maps.event.addListener(marker,'click',function(){
        infowindow.setContent(contentString);
        infowindow.open(map,marker)});
        gmarkers[hotel_id]=marker};
var-gmarkers=[];
var-map=null;
函数初始化(){
变异性肌肽={
缩放:10,
中心:新的google.maps.LatLng(parseFloat(gmapcentrelat),parseFloat(gmapcentrelong)),mapTypeControl:true,
mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
导航控制:对,
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map(document.getElementById(“map_canvas”),
肌肽);
google.maps.event.addListener(映射,'click',函数(){
infowindow.close()
});
//从example.xml读取数据
下载URL(gmapfile,函数(doc){
var xmlDoc=xmlParse(doc);
var markers=xmlDoc.documentElement.getElementsByTagName(“酒店”);
对于(var i=0;i1)
{star_html='
'} var hotel_id=(markers[i].getAttribute(“id”); var hotel_name=(markers[i].getElementsByTagName(“给定名称”)[0].firstChild.nodeValue); var country=(markers[i].getAttribute(“country_id”); var city=(markers[i].getAttribute(“city_id”); 变量位置=(标记[i].getAttribute(“位置”); var filetxt=(标记[i].getAttribute(“文件名”); var countrytxt=(markers[i].getAttribute(“country_name”); countrytxt=countrytxt.toLowerCase(); countrytxt=countrytxt.replace(“,”); var cityText=(标记[i].getAttribute(“城市名称”); cityText=cityText.toLowerCase(); cityText=cityText.replace(“,”); var html=''; //创建标记 var marker=createMarker(点、html、星、酒店id) } }) }; var infowindow=new google.maps.infowindow( { 尺寸:新谷歌地图尺寸(150,50) }); 功能myclick(i){ google.maps.event.trigger(gmarkers[i],“点击”) }; 函数createMarker(latlng、html、star、hotel_id){ var contentString=html; var marker=new google.maps.marker({ 位置:latlng, 地图:地图, 图标:'http://'+servername+'hotels/graphics/red_'+star+'u star.png', zIndex:Math.round(latlng.lat()*-100000)利用.extend()和.fitBounds()。下面,在创建标记时,fullBounds矩形将增长以包含标记。然后,在创建标记后,只需将地图适配到该矩形

var fullBounds = new google.maps.LatLngBounds();

for(var i=0;i<markers.length;i++){
  var lat=parseFloat(markers[i].getAttribute("lat"));
  var long=parseFloat(markers[i].getAttribute("long"));
  var point=new google.maps.LatLng(lat,long);

  fullBounds.extend(point);

  ...

}

map.fitBounds(fullBounds);
var fullBounds=new google.maps.LatLngBounds();

先生,你是个天才。谢谢你,伙计!