0

ここでの前の質問 ：Google Maps API （IE7 IE8）でのスタックオーバーフロー その間に次の質問を見つけました：Google Maps API v3：fitBoundsの後にsetZoomを設定できますか？

マップ上に複数のマーカーがある場合、そこでの解決策は問題なく機能します。ただし、groupbke.young.netaffinity.netのサブページにアクセスすると、たとえば、https://groupbke.young.netaffinity.net/hotels/ireland/dublin/dublin/young-testing-hotel-liege/specials/bed-and-breakfast マップは、map.fitBounds（）が呼び出された場合にのみロードされます。一方、マップがロードされていない場合でも、マップキャンバスの上をスクロールすると、スタックオーバーフローエラーがスローされます。setZoomを使おうとすると、とにかくスタックオーバーフローが発生します。

何か案は？

var hoteldata = [
['Young Testing Hotel - Liège', 53.33932, -6.261427, '<div class="nearby-hotel"> <h1><a href="/hotels/ireland/dublin/dublin/young-testing-hotel-liege">Young Testing Hotel - Liège</a></h1> <div class="star-rating-1"></div><div class="clear"></div> <div class="nearby-hotel-image l"> <a href="/hotels/ireland/dublin/dublin/young-testing-hotel-liege"><img src="http://groupbke.young.netaffinity.net/bookings/images/imagecache/3/0C9DBC143E18ED64059C1696A52D2941-60x60.jpg" border="1" class="imagetype1"/></a> </a> </div> <div class="nearby-hotel-description l">  <a class="nearby-hotel-desc" href="/hotels/ireland/dublin/dublin/young-testing-hotel-liege">Dublin\'s most luxurious design hotel is located in the heart of the city. Experience the best of both worlds when staying at this chic haven, to one side the tranquility and calm of St Stephen\'s Green and to the other, Grafton Street, Dublin\'s finest shopping avenue.    From its central location, in amongst this buzzing vibrant city it is an easy stroll to explore the leading cultural, historical and leisure attractions. Or just step out to the chic shopping, high energy bars, fine dining restaurants and chattering Cafes.</a> <a href="/hotels/ireland/dublin/dublin/young-testing-hotel-liege" class="btn-small">Book Now</a> </div> <div class="clear"></div> </div>', 4]
];
function initialize(mapid) {
var myOptions = {
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false
};
var bounds = new google.maps.LatLngBounds();
var map = new google.maps.Map(document.getElementById(mapid), myOptions);
var infowindow = new google.maps.InfoWindow();
var markers = [];

for (i = 0; i < hoteldata.length; i++) {
    var latLng = new google.maps.LatLng(hoteldata[i][1], hoteldata[i][2]);
    bounds.extend(latLng);
    var img = '/images/hotel-marker.png';
    if (hoteldata[i][4] == 2) {
        img = '/images/country-marker.png';
    }
    if (hoteldata[i][4] == 3) {
        img = '/images/guesthouse-marker.png';
    }
    if (hoteldata[i][4] == 4) {
        img = '/images/hotel-self-marker.png';
    }
    var marker = new google.maps.Marker({
    position: latLng,
    icon: img,
    shadow: '/images/marker-shadow.png'
    });
    markers.push(marker);
    bindInfoWindow(marker, map, infowindow, hoteldata[i][3]);

}

var clusterStyles = [
  {
    opt_textColor: 'white',
    url: '/images/m3-blue.png',
    height: 65,
    width: 64
  },
 {
    opt_textColor: 'white',
    url: '/images/m3-green.png',
    height: 65,
    width: 64
  },
 {
    opt_textColor: 'white',
    url: '/images/m3-orange.png',
    height: 65,
    width: 64 
  }
];

var mcOptions = {
    styles: clusterStyles,
    maxZoom:14

};


if (markers.length>1){
    var markerCluster = new MarkerClusterer(map, markers, mcOptions);
    map.fitBounds(bounds);
    google.maps.event.addListenerOnce(map, 'zoom_changed', function() {
            var oldZoom = map.getZoom();
            map.setZoom(oldZoom + (-7)); //Or whatever
    });
} else if (markers.length == 1){
    markers[0].setMap(map);
    //google.maps.event.clearListeners(map, 'zoom_changed');
    //google.maps.event.addListenerOnce(map, 'zoom_changed', function() {
        //  var oldZoom = map.getZoom();
        //  map.setZoom(oldZoom + (-7)); //Or whatever
    //  setTimeout('roomSetter(globalmap,globalzoom)',300);
    //});
    //google.maps.event.trigger(map,'zoom_changed');
    //google.maps.event.clearListeners(map, 'zoom_changed');
    //map.fitBounds(bounds);
    //var oldZoom = map.getZoom();
    //map.setCenter(bounds.getCenter());
    //map.setZoom(oldZoom+(-7));
    //map.setZoom(3);
    //globalmap=map;
    //globalzoom=map.getZoom()+(-7);
    //setTimeout('zoomSetter(globalmap,globalzoom)',300);
}
}

var globalmap;
var globalzoom;

function zoomSetter(map, zoom){
//map.setZoom(zoom);
}

function bindInfoWindow(marker, map, infowindow, html) { 
google.maps.event.addListener(marker, 'click', function() { 
    infowindow.setContent(html); 
    infowindow.open(map, marker); 
    }); 
} 

function initmaps() {
initialize('map_canvas');
initialize('map_thumb');
}

google.maps.event.addDomListener(window, 'load', initmaps);

問題を実証するために、3つのテストページを設定しました。

http://groupbke.young.netaffinity.net/maptest1.html

これにはsetZoom（）関数があり、これは正しいはずですが、stackoverflowエラーをスローします

http://groupbke.young.netaffinity.net/maptest2.html

これは、マーカーをマップに追加する以外には何もしません。マップ上でスクロールズームしても、スタックエラーがスローされます。

http://groupbke.young.netaffinity.net/maptest3.html

これにはfitBound（）があり、理論的には適切ではありませんが、機能します。その後、ズームレベルを調整できません。調整すると、スタックオーバーフローエラーが発生します。スクロールズームが機能します。

4

2 に答える 2

2

前の質問の答えに欠けていたのは、初期のズームレベルと中心を設定する必要があるということでした。

    var myOptions = {
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: false,
            zoom:22,
            center: new google.maps.LatLng(50.820645,-0.137376)
    };

また、マルチマーカーズーム調整でイベントを「アイドル」に変更する必要がありました。

if (markers.length>1){
    var markerCluster = new MarkerClusterer(map, markers, mcOptions);
    map.fitBounds(bounds);
    google.maps.event.addListenerOnce(map, 'idle', function() {
        var oldZoom = map.getZoom();
        map.setZoom(oldZoom + (-7)); //Or whatever
    });
}

その後はチャームのように機能します。

于 2012-08-02T08:30:01.293 に答える
0

LatLngBoundsホテルが1つしかない場合は、ポイントを1つだけ含むオブジェクトを作成します。

for (i = 0; i < hoteldata.length; i++) {
    var latLng = new google.maps.LatLng(hoteldata[i][1], hoteldata[i][2]);
    bounds.extend(latLng);
...}

しかし、次に実行しますmap.fitBounds(bounds)—これは無限ズームを試みます。APIがそれに対処できるはずであるということは議論の余地がありますが、あなたが言ったことを正確に実行しようとすることも同様に議論の余地があります。IEはFirefoxや他のブラウザとは異なる動作をする可能性があります。

fitBounds()質問の引用コードでコメントアウトした場合、それはオンラインページにあります。その線は、1つのマーカーが含まれ、boundsオブジェクトが1つのポイントである場合にのみ適用されるため、setZoom()代わりに単純なものに置き換えます。

map.setZoom(16);
于 2012-08-01T16:19:32.167 に答える