Simple Polygon

by Sanjay Kumar N S

HTML

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

CSS

/* 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;
}

JavaScript

// 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 = 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 = google.maps.geometry.poly.containsLocation(e.latLng, polygon);
  });
}