How can I change the color of a Google Maps marker?

by

With version 3 of the Google Maps API, the easiest way to do this may be by grabbing a custom icon set, like the one that Benjamin Keen has created here:

http://www.benjaminkeen.com/google-maps-coloured-markers/

If you put all of those icons at the same place as your map page, you can colorize a Marker simply by using the appropriate icon option when creating it:

var beachMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  icon: 'brown_markerA.png'
});

This is super-easy, and is the approach I’m using for the project I’m working on currently.

More Related Contents:

  1. Google Maps API 3 fitBounds padding – ensure markers are not obscured by overlaid controls
  2. Google Map Infowindow not showing properly
  3. Angular2 – Component into dynamically created element
  4. Exceed 23 waypoint per request limit on Google Directions API (Business/Work level)
  5. Google maps Marker Label with multiple characters
  6. Geographical boundaries of states/provinces -> Google Maps Polygon
  7. How to offset the center of a Google maps (API v3) in pixels?
  8. Showing a Google Map in a modal created with Twitter Bootstrap
  9. Adding multiple markers with infowindows (Google Maps API)
  10. Adding multiple markers in Google Maps API v2 Android
  11. Flutter: How to add marker to Google Maps with new Marker API?
  12. Google Maps API – Getting Street Coordinates
  13. How to load a Google Maps baselayer in Leaflet (after june 2018)?
  14. Twitter Bootstrap CSS affecting Google Maps
  15. How to get place description from Google Places API
  16. Google Maps v2 – set both my location and zoom in
  17. How do I remove default markers?
  18. Google Maps API Polygon with “Hole” In Center
  19. Polygon of world map with a hole (google maps)
  20. Google Maps Multiple markers with the exact same location Not working
  21. Autocomplete in SearchBox does not work even in official example
  22. get city from geocoder results?
  23. Polygon Drawing and Getting Coordinates with Google Map API v3 [closed]
  24. Google static maps with directions
  25. Blacklisting specific roads from Google Maps/Mapquest?
  26. Box/Rectangle Draw Selection in Google Maps
  27. Is it possible to write custom text on Google Maps API v3?
  28. GoogleMaps v3 API Create only 1 marker on click
  29. Google Maps, open info window after click on a link
  30. Google map driving direction source code for their example?

Leave a Comment