將自定義圖標添加到谷歌地圖

我不是一個JavaScript大師，所以我需要一個手將一個自定義圖標添加到一些谷歌地圖的JavaScript。將自定義圖標添加到谷歌地圖

以下代碼供您參考。

一切好的東西 P

function populateMap() { 
var map = new GMap2(document.getElementById("map")); 
map.setCenter(new GLatLng(55.915832522285235, -3.5911989212036133), 10); 
map.setUIToDefault(); 



var points = new Array(5); 

    points[1] = [55.992602,-3.92968,'<div class="infoContainer"><h2><a href="#">Mayfield Drive, Longcroft, Bonnybridge<\/a><\/h2><p class="address">{locations_address}<\/p><\/div>']; 



    points[2] = [55.9471382,-3.9729174,'<div class="infoContainer"><h2><a href="#">Oakwood Cumbernauld<\/a><\/h2><p class="address">{locations_address}<\/p><\/div>']; 



    points[3] = [55.933873,-3.12406,'<div class="infoContainer"><h2><a href="#">Wauchope Square, Edinburgh<\/a><\/h2><p class="address">{locations_address}<\/p><\/div>']; 



    points[4] = [55.843728,-3.95258,'<div class="infoContainer"><h2><a href="#">Gibb Street, Chapelhall<\/a><\/h2><p class="address">{locations_address}<\/p><\/div>']; 



    points[5] = [55.854559,-4.000543,'<div class="infoContainer"><h2><a href="#">Paddock Street, Sikeside<\/a><\/h2><p class="address">{locations_address}<\/p><\/div>']; 




for(var i=1; i < points.length; i++) { 
    var point = new GLatLng(points[i][0],points[i][1]); 
    var windowInfo = points[i][2]; 
    var marker = createMarker(point,windowInfo); 
    map.addOverlay(marker); 
} 
} 

    function createMarker(point, overlayText) { 
var marker = new GMarker(point); 
GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(overlayText);}); 
return marker; 
} 

    function addLoadEvent(func) { 
var oldonload = window.onload; 
if (typeof window.onload != 'function') { 
    window.onload = func; 
} else { 
    window.onload = function() { 
    if (oldonload) { 
    oldonload(); 
    } 
    func(); 
    } 
} 
} 

addLoadEvent(populateMap);

來源

2009-11-14 mathalete

http://code.google.com/apis/maps/articles/customicons.html

谷歌地圖的

http://groups.google.com/group/google-maps-api/web/examples-tutorials-custom-icons-for-markers

來源

2009-11-14 12:22:59 Dmitry

感謝我已經看了這些，但不能太相信在那裏我整合了var myIcon =新GICON（G_DEFAULT_ICON）;進入我的代碼。這就是我需要幫助的地方。謝謝 – mathalete 2009-11-14 12:35:43

當您創建GMarker的實例時，您可以傳遞第二個參數GMarkerOptions。其'圖標'屬性將包含您的自定義GIcon。它在官方Maps API文檔中的代碼示例中很明顯：http://code.google.com/apis/maps/documentation/overlays.html#Custom_Icons – Dmitry 2009-11-14 16:58:07

無API網頁似乎工作，但是這可能會幫助任何機構有類似的問題

// Create our "tiny" marker icon 
var centreicon = new GIcon(); 
centreicon.constructor 
centreicon.image = "http://maps.google.com/mapfiles/kml/pal3/icon31.png "; 
centreicon.shadow = "http://maps.google.com/mapfiles/kml/pal3/icon31s.png "; 
centreicon.iconSize = new GSize(12, 20); 
centreicon.shadowSize = new GSize(22, 20); 
centreicon.iconAnchor = new GPoint(6, 20); 
centreicon.infoWindowAnchor = new GPoint(5, 1);

....... y我們的代碼來創建地圖，然後

  var marker = new GMarker(point, centreicon); 

      map.addOverlay(marker);

來源

2011-02-14 22:47:15 Neil

將自定義圖標添加到谷歌地圖

回答

相關問題