Determining if Geocode falls within a Polygon/Series of Geocodes

Question

I have a series of geocodes for a pre-defined area/polygon that represents a sales region. For example:

-33.83585327701507, 151.2809005901216
-33.73335715102409, 150.8744770943904
-33.82163832733159, 150.8404448193081
-33.9974469167501, 151.247420749521
-33.83585327701507, 151.2809005901216

I then have a separate geocode that represents a location, e.g.:

-33.7984533, 151.1824504

I need to determine if the single location geocode falls within the pre-defined sales region/polygon. Is there an API or other method for programatically determining this? Couldn't see a Google Maps API for this so far.

Answer 1

That point (-33.7984533, 151.1824504), isn't in the polygon you provided. To determine that with the Google Maps Javascript API v3, use the google.maps.geometry.poly.containsLocation method:

google.maps.geometry.poly.containsLocation(new google.maps.LatLng(-33.7984533, 151.1824504), polygon)

proof of concept fiddle

code snippet:

// This example creates a simple polygon representing the Bermuda Triangle.

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 5,
    center: {
      lat: 24.886,
      lng: -70.268
    },
    mapTypeId: 'terrain'
  });

  // Define the LatLng coordinates for the polygon's path.
  var polygonCoords = [{
      lat: -33.83585327701507,
      lng: 151.2809005901216
    },
    {
      lat: -33.73335715102409,
      lng: 150.8744770943904
    },
    {
      lat: -33.82163832733159,
      lng: 150.8404448193081
    },
    {
      lat: -33.9974469167501,
      lng: 151.247420749521
    },
    {
      lat: -33.83585327701507,
      lng: 151.2809005901216
    },
  ];

  // Construct the polygon.
  var polygon = new google.maps.Polygon({
    paths: polygonCoords,
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FF0000',
    fillOpacity: 0.35,
    clickable: false
  });
  polygon.setMap(map);
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i < polygon.getPath().getLength(); i++) {
    bounds.extend(polygon.getPath().getAt(i))
  }
  map.fitBounds(bounds);
  var marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-33.7984533, 151.1824504)
  })
  console.log(google.maps.geometry.poly.containsLocation(new google.maps.LatLng(-33.7984533, 151.1824504), polygon));
  document.getElementById('contains').innerHTML = "containsLocation returns " + google.maps.geometry.poly.containsLocation(new google.maps.LatLng(-33.7984533, 151.1824504), polygon);
  google.maps.event.addListener(map, 'click', function(e) {
    console.log(google.maps.geometry.poly.containsLocation(e.latLng, polygon));
    document.getElementById('contains').innerHTML = "containsLocation returns " + google.maps.geometry.poly.containsLocation(e.latLng, polygon);
  });
}

/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */

#map {
  height: 80%;
}


/* Optional: Makes the sample page fill the window. */

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

<div id="contains"></div>
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap&libraries=geometry">
</script>