更改谷歌地圖與變焦的自定義圖標

我想改變我的谷歌地圖標記，以便當變焦是< 5時，他們從他們的自定義標記更改爲星形圖像。這是我到目前爲止（不工作）更改谷歌地圖與變焦的自定義圖標

//zoom icons to stars at continent level 
google.maps.event.addListener(busMap, 'zoom_changed', function() { 
    var markerIconStar = google.maps.MarkerImage("icons/star.png"); 
    var currentZoom = busMap.getZoom(); 
    if (currentZoom < 5){ 
     markerSanFran.setIcon(markerIconStar); 
     markerLA.setIcon(markerIconStar); 
     markerHollywood.setIcon(markerIconStar); 
     markerSantaCruz.setIcon(markerIconStar); 
     markerSanDiego.setIcon(markerIconStar); 
     markerLasVegas.setIcon(markerIconStar); 
     markerGrandCan.setIcon(markerIconStar); 
     markerMamLakes.setIcon(markerIconStar); 
     markerYosemite.setIcon(markerIconStar); 
     } 

});

http://screamingeagle.travel/map/map2.html是在這裏你可以看到代碼的其餘部分在行動目前

來源

2013-09-24 Michelle Koen

出現了什麼問題？它被解僱的事件？您在哪裏定義標記和地圖對象 – Jorge

僅供參考 - 不推薦使用MarkerImage對象，替換爲[google.maps.Icon]（https://developers.google.com/maps/documentation/javascript/reference#Icon）對象規範。當用戶縮小時，您可能需要將圖標更改回來。 – geocodezip

的busMap之前，您要添加的ZOOM_CHANGED監聽到地圖被定義，所以它不會發生。將它添加到已定義的busMap中（在您的loadBusMap函數中）

function loadBusMap() { 

//The empty map variable ('busMap') was created above. The line below creates the map, assigning it to this variable. The line below also loads the map into the div with the id 'bus-map' (see code within the 'body' tags below), and applies the 'busMapOptions' (above) to configure this map. 
busMap = new google.maps.Map(document.getElementById("bus-map"), busMapOptions);  

directionsDisplay = new google.maps.DirectionsRenderer(); 

//Assigning the two map styles defined above to the map. 
busMap.mapTypes.set('map_styles_bus', styled_bus); 
busMap.mapTypes.set('map_styles_bus_zoomed', styled_bus_zoomed); 
//Setting the one of the styles to display as default as the map loads. 
busMap.setMapTypeId('map_styles_bus'); 

//Calls the function below to load up all the map markers and pop-up boxes. 
loadMapMarkers(); 

google.maps.event.addListener(busMap, 'zoom_changed', function() { 
    var markerIconStar = google.maps.MarkerImage("icons/star.png"); 

    var currentZoom = busMap.getZoom(); 
    if (currentZoom < 5){ 
     markerSanFran.setIcon(markerIconStar); 
     markerLA.setIcon(markerIconStar); 
     markerHollywood.setIcon(markerIconStar); 
     markerSantaCruz.setIcon(markerIconStar); 
     markerSanDiego.setIcon(markerIconStar); 
     markerLasVegas.setIcon(markerIconStar); 
     markerGrandCan.setIcon(markerIconStar); 
     markerMamLakes.setIcon(markerIconStar); 
     markerYosemite.setIcon(markerIconStar); 
     } 

    }); 
}

來源

2013-09-24 21:38:49 geocodezip

更改谷歌地圖與變焦的自定義圖標

回答

相關問題