Check if map markers are within certain boundaries

Question

I have a map with various markers, and I need to draw a rectangle on the map and select the markers that are within the rectangle.

So far I have found excellent information here: How to get the markers inside the area selected by dragging and dropping?

I implemented the keymapzoom plugin in order. 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 warning (bnds);

I need to know how now I can check if there are any markers in it?

I already have an object that stores markers for another reason. as:

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

which might be useful?

I do not understand how to use GLatLngBounds and containsLatLng (latlng: GLatLng) as suggested.

Answer 1

Select Draw / Rectangle Draw on Google Maps

That was my decision.

  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"); } }); 

Answer 2

Your question is tagged with v3 API version v3, so I assume you are using this version (which you should use since v2 is deprecated). Please note that some classes and methods are called differently than in your question.

Borders are represented by the LatLngBounds class. You can execute the contains method on an instance of this class to determine if a point is within these boundaries.

If you have an object with all your markers, you can skip them and check each marker, for example:

 var bounds = new google.maps.LatLngBounds(sw, ne); for (var a in markers) { if (bounds.contains(new google.maps.LatLng(markers[a].lat, markers[a].lng)) { // marker is within bounds } } 

On a side note, I will store the LatLng object in the markers object when they are created. Thus, you do not need to create them where you need to.