Question

I have a map with various markers and i need to be able to draw a rectangle on the map and select the markers which are within the rectangle bounds.

So far i have found some great info here: How to get markers inside an area selected by mouse drag?

I have implemented the keymapzoom plugin ok. like so

    $('#dispatcher').gmap3({action:'get'}).enableKeyDragZoom({
        boxStyle: {
          border: "dashed black",
          //backgroundColor: "red",
          opacity: 0.5
        },
        paneStyle: {
          backgroundColor: "gray",
          opacity: 0.2
        }
  });
var dz = $('#dispatcher').gmap3({action:'get'}).getDragZoomObject();
google.maps.event.addListener(dz, 'dragend', function (bnds) {
  alert(bnds);
});

This gives me the following
((lat,long),(lat,long)) format from the alert(bnds);

I need to know how i can now check if any markers are within this?

I already have an object that is storing the markers for another reason. like:

    markers[name] = {};
    markers[name].lat = lati;
    markers[name].lng = longi;

which might be useful?

I don’t understand how to use the GLatLngBounds and containsLatLng(latlng:GLatLng) as suggested.

Answer 1

Box/Rectangle Draw Selection in Google Maps

This was my solution..

     google.maps.event.addListener(dz, 'dragend', function(e) { //important listener          
      for(var i = 0; i < markers.length; i++){ // looping through my Markers Collection       
        if(e.contains(markers[i].position))
            console.log("Marker"+ i +" - matched");
        }         
     });