javascript - Google Maps API Circle Icons -


i trying make map using google maps api , red dot icons (aka earthquake icons).

i have several locations , several magnitudes, since of magnitudes lower therefore not visible red dot icons apply locations.

var marker1; var marker2 (var = 0; < locations.length; i++) {      if (locations[i][3] > 5){         alert("i in");}           marker1 = new google.maps.marker({             position: new google.maps.latlng(locations[i][1], locations[i][2]),             map: map,             icon: getcircle(locations[i][3])         });      if(locations[i][3] < 5){         marker2 = new google.maps.marker({             position: new google.maps.latlng(locations[i][1], locations[i][2]),             map: map,             animation: google.maps.animation.bounce         });     }   google.maps.event.addlistener(marker, 'click', (function(marker, i) {     return function() {       infowindow.setcontent(locations[i][0]);       infowindow.open(map, marker1);     }   })(marker1, i));  } 

the problem resides on marker1. because if try limit marker locations magnitude higher 5 not design single icon , alert not trigger.

but if remove code of marker1 within "if" statement (like example), alert triggered , icons appear on map.

marker 2 can filtered no problems.

why working way? move "}" few lines below. cannot understand.

thanks help!

that code complicated, , way uses 2 global marker1 , marker2 variables, can't possibly want do.

i'm not entirely clear do want code do, can show cleaner way code may step in right direction?

for( var = 0;  < locations.length;  i++ ) {     addmarker( locations[i] ); }  function addmarker( location ) {     var lat = location[1], lng = location[2],         magnitude = location[3], content = location[0];      var options = {         position: new google.maps.latlng( lat, lng ),         map: map     };      if( magnitude > 5 ) {         options.icon = getcircle( magnitude );     }     else {         options.animation = google.maps.animation.bounce;     }      var marker = new google.maps.marker( options );      google.maps.event.addlistener( marker, 'click', function() {         infowindow.setcontent( content );         infowindow.open( map, marker );     }); } 

differences worth noting:

  • no global marker1 , marker2 variables. instead, every marker has own marker variable.
  • a simple call addmarker() method creates closure need, instead of complicated function-returning-a-function.
  • use of named variables locations[i][n] properties make more readable.
  • handles case magnitude 5, original code skips. (change test > 5 >= 5 if needed.)
  • combined 2 google.maps.marker() calls avoid bit of repetition.

hopefully make easier figure out going on , need do.


Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -