Google Map: Is a Lat/Lng Within a Polygon

Google Map: is a lat/lng within a polygon?

One way to find if a point is in a polygon is to count how many times a line drawn from the point (in any direction) intersects with the polygon boundary. If they intersect an even number of times, then the point is outside.

I have implemented the C code from this Point in Polygon article in php and used the polygon below to illustrate.

<?php
//Point-In-Polygon Algorithm
$polySides  = 4; //how many corners the polygon has
$polyX    =  array(4,9,11,2);//horizontal coordinates of corners
$polyY    =  array(10,7,2,2);//vertical coordinates of corners
$x = 3.5;
$y = 13.5;//Outside
//$y = 3.5;//Inside

function pointInPolygon($polySides,$polyX,$polyY,$x,$y) {
  $j = $polySides-1 ;
  $oddNodes = 0;
  for ($i=0; $i<$polySides; $i++) {
    if ($polyY[$i]<$y && $polyY[$j]>=$y 
 ||  $polyY[$j]<$y && $polyY[$i]>=$y) {
    if ($polyX[$i]+($y-$polyY[$i])/($polyY[$j]-$polyY[$i])*($polyX[$j]-$polyX[$i])<$x)    {
    $oddNodes=!$oddNodes; }}
   $j=$i; }

  return $oddNodes; }

 if (pointInPolygon($polySides,$polyX,$polyY,$x,$y)){
  echo "Is in polygon!";
}
else echo "Is not in polygon";
?>

Google Map: is a lat/lng within a polygon?

One way to find if a point is in a polygon is to count how many times a line drawn from the point (in any direction) intersects with the polygon boundary. If they intersect an even number of times, then the point is outside.

I have implemented the C code from this Point in Polygon article in php and used the polygon below to illustrate.

<?php
//Point-In-Polygon Algorithm
$polySides  = 4; //how many corners the polygon has
$polyX    =  array(4,9,11,2);//horizontal coordinates of corners
$polyY    =  array(10,7,2,2);//vertical coordinates of corners
$x = 3.5;
$y = 13.5;//Outside
//$y = 3.5;//Inside

function pointInPolygon($polySides,$polyX,$polyY,$x,$y) {
  $j = $polySides-1 ;
  $oddNodes = 0;
  for ($i=0; $i<$polySides; $i++) {
    if ($polyY[$i]<$y && $polyY[$j]>=$y 
 ||  $polyY[$j]<$y && $polyY[$i]>=$y) {
    if ($polyX[$i]+($y-$polyY[$i])/($polyY[$j]-$polyY[$i])*($polyX[$j]-$polyX[$i])<$x)    {
    $oddNodes=!$oddNodes; }}
   $j=$i; }

  return $oddNodes; }

 if (pointInPolygon($polySides,$polyX,$polyY,$x,$y)){
  echo "Is in polygon!";
}
else echo "Is not in polygon";
?>

Is LatLng inside a polygon

Use the containsLocation(point:LatLng, polygon:Polygon) method.

containsLocation(point:LatLng, polygon:Polygon) boolean Computes whether the given point lies inside the specified polygon.

proof of concept fiddle

code snippet:

function checkInPolygon(marker, polygon) {  var infowindow = new google.maps.InfoWindow();  var html = "";  if (google.maps.geometry.poly.containsLocation(marker.getPosition(), polygon)) {    html = "inside polygon";  } else {    html = "outside polygon";  }  infowindow.setContent(html);  infowindow.open(map, marker);}
var map;var coord1 = new google.maps.LatLng(26.194876675795218, -69.8291015625);var coord2 = new google.maps.LatLng(33.194876675795218, -63.8291015625);
function initialize() {  var map = new google.maps.Map(    document.getElementById("map_canvas"), {      center: new google.maps.LatLng(37.4419, -122.1419),      zoom: 13,      mapTypeId: google.maps.MapTypeId.ROADMAP    });  bermudaTriangle.setMap(map);  var bounds = new google.maps.LatLngBounds();  for (var i = 0; i < bermudaTriangle.getPath().getLength(); i++) {    bounds.extend(bermudaTriangle.getPath().getAt(i));  }  bounds.extend(coord1);  bounds.extend(coord2);  var marker1 = new google.maps.Marker({    map: map,    position: coord1  });  var marker2 = new google.maps.Marker({    map: map,    position: coord2,  });  map.setCenter(bounds.getCenter());  map.setZoom(3);  checkInPolygon(marker1, bermudaTriangle);  checkInPolygon(marker2, bermudaTriangle);}google.maps.event.addDomListener(window, "load", initialize);
var bermudaTriangle = new google.maps.Polygon({  paths: [    new google.maps.LatLng(25.774252, -80.190262),    new google.maps.LatLng(18.466465, -66.118292),    new google.maps.LatLng(32.321384, -64.75737),  ]});

html,body,#map_canvas {  height: 100%;  width: 100%;  margin: 0px;  padding: 0px}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script><div id="map_canvas"></div>

Get Lat Lng when drawing a polygon with Google Maps drawing tool

There are a few ways to get the coordinates of the shapes you draw on the map. Specifically for polygons you can add an event listener to the map like so. The easiest way is to add an event listener to the map for when a polygon is finished drawing.

google.maps.event.addListener(drawingManager, 'polygoncomplete', function(polygon) {
  const coords = polygon.getPath().getArray().map(coord => {
    return {
      lat: coord.lat(),
      lng: coord.lng()
    }
  });

  console.log(JSON.stringify(coords, null, 1));

  // SAVE COORDINATES HERE
});

Each type of drawing has a different format for saving so for something like circles you'd do

google.maps.event.addListener(drawingManager, 'circlecomplete', function(circle) {
  const radius = circle.getRadius();

  // Save circle here
});

You also have the option of adding an event to listen for all of the events by listening to the overlaycomplete event but in that case you'd have to handle the different types inside the event.

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
  if (event.type == 'circle') {
    // Handle Circle using event.overlay
  }

  if (event.type == 'polygon') {
    // Handle Polygon using event.overlay
  }
});

Here's an example:
https://jsfiddle.net/juop8q3n/1/

And here's my sources:

• https://developers-dot-devsite-v2-prod.appspot.com/maps/documentation/javascript/drawinglayer#drawing_events
• https://developers-dot-devsite-v2-prod.appspot.com/maps/documentation/javascript/reference#drawing-on-the-map

EDIT

Another way I've seen people save the data is by adding an event listener to the map to get the GeoJSON data, which is a standard format for saving drawing data.

Link: http://jsfiddle.net/y89rbfLo/

Filling Google Maps polygon from array of LatLng points

Correct me if I had misunderstood your question.

Q:
Is it possible to place the LatLng data points from my array into triangleCoords and create the polygon that way?

A:

Short answer: No. Unfortunately there is no smartness in the google.maps.Polygon code which would magically try to figure out the lat and lng coordinates of the specified google.maps.LatLng objects for you.

You will need to use the lat() and lng() APIs to return the raw coordinate values from the google.maps.LatLng object and plug that into your array. No shortcut.

Example:

var map = new google.maps.Map(document.getElementById("map"),
{
    zoom: 4,
    center: new google.maps.LatLng(22.7964, 79.8456),
    mapTypeId: google.maps.MapTypeId.HYBRID
});

var coordinateA = new google.maps.LatLng(18.979026,72.949219);
var coordinateB = new google.maps.LatLng(28.613459,77.255859);
var coordinateC = new google.maps.LatLng(22.512557,88.417969);
var coordinateD = new google.maps.LatLng(12.940322,77.607422);

var coords =
    [
        {lat: coordinateA.lat(), lng: coordinateA.lng() },
        {lat: coordinateB.lat(), lng: coordinateB.lng() },
        {lat: coordinateC.lat(), lng: coordinateC.lng() },
        {lat: coordinateD.lat(), lng: coordinateD.lng() }
    ];

metros = new google.maps.Polygon(
    {
        paths: coords,
        strokeColor: "#0000FF",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#0000FF",
        fillOpacity: 0.26
    });

See here for a working JSFiddle example.
http://jsfiddle.net/SamuelToh/3srggbmu/

Check if the point is within the Google Maps polygon in flutter

I managed to solve using maps_toolkit using PolygonUtil.containsLocation - computes whether the given point lies inside the specified polygon.
It conflicted with my Google Maps package, so I created an isolated class just to check and send the response to my main screen.
Sorry for my English..

How do you search within a Polygon's coordinates on Google Maps?

onOverlayComplete event has the following signature:

onOverlayComplete?(e: google.maps.drawing.OverlayCompleteEvent): void

When the user has finished drawing a polygon, OverlayCompleteEvent.overlay property returns the instance of Polygon object, the following snippet demonstrates how to determine whether the given point lies inside the specified polygon:

handleOverlayComplete(e) {

    const polygon = e.overlay;
    const latLng = new google.maps.LatLng(lat, lng);
    const containsPlace = google.maps.geometry.poly.containsLocation(
        latLng,
        polygon
    );
    //...
}

Alternatively onPolygonComplete event could be utilized:

onPolygonComplete?(p: google.maps.Polygon): void

This demo demonstrates how to highlight a marker if it contains within a drawn polygon

detecting point within polygon (latitude and longitude) in PHP

If you are just wanting to check if the polygon contains your point using Google maps you can try : Google Maps API

If you want to calculate it in PHP then your question is a duplicate of this: Check if Google Map Point is in polygon from PHP

---

Related Topics