You can dynamically request icon images from the Google charts api with the urls:

http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569

Which looks like this:default the image is 21×43 pixels and the pin tip is at position (10, 34)

And you’ll also want a separate shadow image (so that it doesn’t overlap nearby icons):

http://chart.apis.google.com/chart?chst=d_map_pin_shadow

Which looks like this:shadow the image is 40×37 pixels and the pin tip is at position (12, 35)

When you construct your MarkerImages you need to set the size and achor points accordingly:

var pinColor = “FE7569”;
var pinImage = new google.maps.MarkerImage(“http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|” + pinColor,
new google.maps.Size(21, 34),
new google.maps.Point(0,0),
new google.maps.Point(10, 34));

var pinShadow = new google.maps.MarkerImage(“http://chart.apis.google.com/chart?chst=d_map_pin_shadow”,
new google.maps.Size(40, 37),
new google.maps.Point(0, 0),
new google.maps.Point(12, 35));

You can then add the marker to your map with:

var marker = new google.maps.Marker({
position: new google.maps.LatLng(0,0),
map: map,
icon: pinImage,
shadow: pinShadow
});

Simply replace “FE7569” with the color code you’re after. Eg:yellow