How to change icon on Google map marker

Question

I want to use my customize icon on Google map  and added icon url on the code  But it s still not reflecting on the map  Can anyone suggest  what i am missing here  Why icon is not changing  after adding the icon url  http   google-maps-icons googlecode com files sailboat-tourism png     lt script type  text javascript  src  http   maps googleapis com maps api js sensor false  gt  lt  script gt    lt script type  text javascript  gt  var markers                                title    This is title            lat    -37 801578                lng    145 060508            icon    http   google-maps-icons googlecode com files sailboat-tourism png                description    Vikash Rathee   lt strong gt  This is test Description lt  strong gt   lt br  gt  lt a href  http   www pricingindia in pincode aspx  gt Pin Code by   City lt  a gt                  lt  script gt   lt script type  text javascript  gt      window onload   function              var mapOptions                 center  new google maps LatLng markers 0  lat  markers 0  lng               zoom  10          flat  true          styles       stylers        hue     4bd6bf        gamma    1 58                       mapTypeId  google maps MapTypeId ROADMAP                    var infoWindow   new google maps InfoWindow            var map   new google maps Map document getElementById  dvMap    mapOptions           for  i   0  i  lt  markers length  i                  var data   markers i              var myLatlng   new google maps LatLng data lat  data lng               var marker   new google maps Marker                   position  myLatlng                  map  map                  title  data title                              function  marker  data                    google maps event addListener marker   click   function  e                        infoWindow setContent data description                       infoWindow open map  marker                                      marker  data                    lt  script gt     lt div id  dvMap  style  width  100   height  100   gt   lt  div gt

User · Answer

try this  var locations               San Francisco  Power Outage   37 7749295  -122 4194155  http   labs google com ridefinder images mm 20 purple png              Sausalito   37 8590937  -122 4852507  http   labs google com ridefinder images mm 20 red png              Sacramento   38 5815719  -121 4943996  http   labs google com ridefinder images mm 20 green png              Soledad   36 424687  -121 3263187  http   labs google com ridefinder images mm 20 blue png              Shingletown   40 4923784  -121 8891586  http   labs google com ridefinder images mm 20 yellow png               inside the loop marker   new google maps Marker                   position  new google maps LatLng locations i  1   locations i  2                    map  map                  icon  locations i  3

User · Answer

Manish  Eden after your suggestion   here is the code  But still showing the red Default  icon    lt script type  text javascript  src  http   maps googleapis com maps api js sensor false  gt  lt  script gt    lt script type  text javascript  gt  var markers                                title    This is title                lat    -37 801578                lng    145 060508            icon    http   maps gstatic com mapfiles ridefinder-images mm 20 green png                description    Vikash Rathee   lt br  gt  lt a href  http   www pricingindia in pincode aspx  gt Pin Code by City lt  a gt                 lt  script gt   lt script type  text javascript  gt      window onload   function              var mapOptions                 center  new google maps LatLng markers 0  lat  markers 0  lng               zoom  10              flat  true              styles       stylers        hue     4bd6bf        gamma    1 58                       mapTypeId  google maps MapTypeId ROADMAP                    var infoWindow   new google maps InfoWindow            var map   new google maps Map document getElementById  dvMap    mapOptions           for  i   0  i  lt  markers length  i                  var data   markers i              var myLatlng   new google maps LatLng data lat  data lng               var marker   new google maps Marker                   position  myLatlng                  map  map          icon  markers i  3                   title  data title                              function  marker  data                    google maps event addListener marker   click   function  e                        infoWindow setContent data description                       infoWindow open map  marker                                      marker  data                    lt  script gt     lt div id  dvMap  style  width  100   height  100   gt   lt  div gt

User · Answer

var marker   new google maps Marker                   position  new google maps LatLng 23 016427 72 571156                   map  map                  icon   images map marker icon png                   title   Hi                       apply local path on icon only

User · Answer

var marker   new google maps Marker     position  myLatLng    map  map    icon   your-icon png

User · Answer

we can change the icon of markers  i did it on right click event  Lets see if it works for you         Create a Marker var marker   new google maps Marker       position  location      map  map      title  Sample Tool Tip             Set Icon on any event google maps event addListener marker   rightclick   function             marker setIcon  blank png       set image path here

User · Answer

You have to add the targeted map    var markers                                title    This is title                lat    -37 801578                lng    145 060508                map    map               icon    http   google-maps-icons googlecode com files sailboat-tourism png                description    Vikash Rathee   lt strong gt  This is test Description lt  strong gt   lt br  gt  lt a href  http   www pricingindia in pincode aspx  gt Pin Code by   City lt  a gt

[javascript] How to change icon on Google map marker

Examples related to javascript

Examples related to google-maps

Examples related to google-maps-api-3

Examples related to google-maps-markers