google maps - How can i change the Marker color clicked previously to its original color -
i displaying markers on google map .
when click on marker , setting different color (blue)
like
this.seticon("http://maps.google.com/mapfiles/ms/icons/blue-dot.png"); this full code
var map; var global_markers = []; var markers = [[37.09024, -95.712891, 'trialhead0'], [-14.235004, -51.92528, 'trialhead1'], [-38.416097, -63.616672, 'trialhead2']]; var infowindow = new google.maps.infowindow({}); function initialize() { geocoder = new google.maps.geocoder(); var latlng = new google.maps.latlng(40.77627, -73.910965); var myoptions = { zoom: 1, center: latlng, maptypeid: google.maps.maptypeid.roadmap } map = new google.maps.map(document.getelementbyid("map_canvas"), myoptions); addmarker(); } function addmarker() { (var = 0; < markers.length; i++) { // obtain attribues of each marker var lat = parsefloat(markers[i][0]); var lng = parsefloat(markers[i][1]); var trailhead_name = markers[i][2]; var mylatlng = new google.maps.latlng(lat, lng); var contentstring = "<html><body><div><p><h2>" + trailhead_name + "</h2></p></div></body></html>"; var marker = new google.maps.marker({ position: mylatlng, map: map, title: "trailhead name: " + trailhead_name }); marker['infowindow'] = contentstring; global_markers[i] = marker; google.maps.event.addlistener(global_markers[i], 'click', function() { this.seticon("http://maps.google.com/mapfiles/ms/icons/blue-dot.png"); infowindow.setcontent(this['infowindow']); infowindow.open(map, this); }); } } window.onload = initialize; http://jsfiddle.net/zlutg/1008/
my question when click on marker , how can set prevous marker in blue color original color
you have array of markers. loop on them, resetting icons.
either markers, set current 1 blue. or within loop have if statement checking if 1 being looped on clicked 1 (i prefer first option).
google.maps.event.addlistener(global_markers[i], 'click', function() { (var j = 0; j < global_markers.length; j++) { global_markers[j].seticon("http://maps.google.com/mapfiles/ms/icons/red-dot.png"); } this.seticon("http://maps.google.com/mapfiles/ms/icons/blue-dot.png"); infowindow.setcontent(this['infowindow']); infowindow.open(map, this); });
Comments
Post a Comment