Question

121

check if map markers are within selected bounds

rated 0 times [ 127] [ 6] / answers: 1 / hits: 15753 / 12 Years ago, wed, june 27, 2012, 12:00:00

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.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

anniejulietteb

Add To Favorites

Follow

Total Points: 740

Total Questions: 125

Total Answers: 97

Location: Benin

Member since Fri, Mar 24, 2023

1 Year ago

answered 12 Years ago kourtney · Accepted Answer

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

        }         

     });