It seems there are two good possibilites. One is to use gmaps.js (http://hpneo.github.io/gmaps/examples/static_markers.html) which lets you specify a color like so (in the third of the three markers added below):
url = GMaps.staticMapURL({
size: [610, 300],
lat: -12.043333,
lng: -77.028333,
markers: [
{lat: -12.043333, lng: -77.028333},
{lat: -12.045333, lng: -77.034, size: 'small'},
{lat: -12.045633, lng: -77.022, color: 'blue'}
]
});
and the other is goMaps, which I've already used, which has an icon property you can set to a .png file. The example can be seen here: http://www.pittss.lv/jquery/gomap/examples/marker_multi.php using this sort of code:
$(function() { $("#map").goMap({ markers: [{
latitude: 56.948813, longitude: 24.704004, title: 'marker title 1' },{ address: 'Mokelumne Hill, California, USA', title: 'marker title 1' },{ latitude: 55.548813, longitude: 23.204004, draggable: true, icon: '../img/drag.png', html: { content: 'drag me!', popup:true } }], icon: '../img/apartment.png' }); });
Now I have a separate question, though, regarding how to use a spriteful of pushpin images (How can I use a sprite to specify the pushpin png I want to use in a map?)