Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google Map icon (pin) - how to define color?

is it possible to change color of pin placed on google map creatted by it's api? or have to use custom icon to do that?

it's google map api v3.

tnx in adv!

like image 490
user198003 Avatar asked Oct 16 '10 11:10

user198003


People also ask

How do you change the color of the icons on Google Maps?

Click on the option labeled Tools and then click on Change map. Once there, click on the button labeled Change feature styles. There are plenty of options for changing the different styles of your markers, which includes changing their color.

What do the different color pins mean on Google Maps?

Green: If your maps have the traffic layer, this color means there should be no delays due to traffic. Orange: If your maps have the traffic layer or selected Directions, this color means that there is some traffic, and therefore it will affect your route. Red: There are two types of red: normal and dark red.


1 Answers

You can declare the image when you initialize the map:

var overlay;

function initialize() {
  var myLatLng = new google.maps.LatLng(0, 0);
  var myOptions = {
    zoom: 11,
    center: myLatLng,
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  var swBound = new google.maps.LatLng(0, 0);
  var neBound = new google.maps.LatLng(0, 0);
  var bounds = new google.maps.LatLngBounds(swBound, neBound);

  // This is where you declare your image...
  var srcImage = 'images/yourimage.png';
  overlay = new USGSOverlay(bounds, srcImage, map);
}

More info here if you need it:

http://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays

like image 146
timothyclifford Avatar answered Nov 15 '22 08:11

timothyclifford