отдельное изображение/значок google maps api

Question

Я тестирую последние дни с google api 3.x.

У меня есть этот код для моего api с картами google.

эту часть я изменил, чтобы получить отдельные изображения для всех записей:

function makeMarker(options) { 

    var pushPin = new google.maps.Marker({ 
    icon: '/individual-icon-for-all.png', 
    map: map 
    }); 

Я хочу использовать отдельный кадр/значок для каждой записи. Как я могу это сделать?

<script> 

/** 
* map 
*/ 
var mapOpts = { 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    scaleControl: true, 
    scrollwheel: false 
} 


var map = new google.maps.Map(document.getElementById("map"), mapOpts); 
// We set zoom and center later by fitBounds() 





/** 
* makeMarker() ver 0.2 
* creates Marker and InfoWindow on a Map() named 'map' 
* creates sidebar row in a DIV 'sidebar' 
* saves marker to markerArray and markerBounds 
* @param options object for Marker, InfoWindow and SidebarItem 
* @author Esa 2009 
*/ 

var infoWindow = new google.maps.InfoWindow(); 
var markerBounds = new google.maps.LatLngBounds(); 
var markerArray = []; 

function makeMarker(options) { 

    var pushPin = new google.maps.Marker({ 
    icon: '/individual-icon-for-all.png', 
    map: map 
    }); 

pushPin.setOptions(options); 

google.maps.event.addListener(pushPin, "click", function() { 
    infoWindow.setOptions(options); 
    infoWindow.open(map, pushPin); 
    if (this.sidebarButton) this.sidebarButton.button.focus(); 
}); 

if (options.sidebarItem) { 
    pushPin.sidebarButton = new SidebarItem(pushPin, options); 
    pushPin.sidebarButton.addIn("sidebar"); 
} 

markerBounds.extend(options.position); 
markerArray.push(pushPin); 
return pushPin; 
} 

google.maps.event.addListener(map, "click", function() { 
infoWindow.close(); 
}); 




/** 
* Creates an sidebar item 
* @constructor 
* @author Esa 2009 
* @param marker 
* @param opt ions object Supported properties: sidebarItem, sidebarItemClassName,    
sidebarItemWidth, 
*/ 
function SidebarItem(marker, opts){ 
    var tag = opts.sidebarItemType || "button"; 
    var row = document.createElement(tag); 
    row.innerHTML = opts.sidebarItem; 
row.className = opts.sidebarItemClassName || "sidebar_item"; 
row.style.display = "block"; 
row.style.width = opts.sidebarItemWidth || "180px"; 
row.onclick = function(){ 
google.maps.event.trigger(marker, 'click'); 
} 
row.onmouseover = function(){ 
google.maps.event.trigger(marker, 'mouseover'); 
} 
row.onmouseout = function(){ 
google.maps.event.trigger(marker, 'mouseout'); 
} 
this.button = row; 
} 
// adds a sidebar item to a <div> 
SidebarItem.prototype.addIn = function(block){ 
    if(block && block.nodeType == 1)this.div = block; 
    else 
    this.div = document.getElementById(block) 
|| document.getElementById("sidebar") 
|| document.getElementsByTagName("body")[0]; 
    this.div.appendChild(this.button); 
} 
// deletes a sidebar item 
SidebarItem.prototype.remove = function(){ 
    if(!this.div) return false; 
    this.div.removeChild(this.button); 
    return true; 
} 

/** 
* markers and info window contents 
*/ 

makeMarker({ 
    position: new google.maps.LatLng(53.086 , 8.978), 
    title: "Blumen", 
    sidebarItem: "Blumen", 
    content: "<p class='partner2'>Blumen</p>", 
}); 




/** 
* fit viewport to markers 
*/ 
map.fitBounds(markerBounds); 
</script> 

Answer 1

Просто включите в настройках вы передаете функции

makeMarker({ 
    position: new google.maps.LatLng(53.086 , 8.978), 
    icon: '/icon-for-this-marker.png', 
    title: "Blumen", 
    sidebarItem: "Blumen", 
    content: "<p class='partner2'>Blumen</p>", 
});