Question

Another absolute beginner here…I have built a page that geolocates the user and places a marker on a map. That works fine. I have also created a rectangle (primarily for use with ST_INTERSECTS and a Fusion Table – but that’s not part of this problem). That also works fine. What I am trying to achieve next is to make the user’s position marker either only appear or only to be clickable if it is within the rectangle (either will do) – i.e. if the user’s is within the area defined by the rectangle. Is there a simple way to do this? Thanks for any suggestions.

Answer 1

I’m going to assume it’s Google Maps Javascript API Version 3.

If a marker is not visible, it can’t be clicked, so you can fulfil both of your criteria by only adding the marker to the map if it’s valid.

First, define your area:

var sw = new google.maps.LatLng(...,...); // SW corner
var ne = new google.maps.LatLng(...,...); // NE corner
var bounds = new google.maps.LatLngBounds(sw,ne);

Then define your marker position:

var mloc = new google.maps.LatLng(...,...);

Then see if it should be added to the map:

if (bounds.Contains(mloc)) { addMarker(mloc) }

Note that addMarker() is a function which you need to write, it’s not part of the API.