Google maps Vérifiez que deux latlng sont sur ou près de la trajectoire dans la bonne direction

Question

J'essaie de trouver un moyen de vérifier si deux points (LatLng) sont sur un chemin (polyligne) ou près de lui, avec une certaine tolérance et dans la bonne direction.

Je vous attendre à obtenir une fonction qui accepte un tableau de points, une polyligne et la tolérance. Ou une combinaison de services.

function isPointsOnPath(points, polyline, tolerance): boolean 

Merci à l'avance

Answer 1

Vous pouvez insérer votre polygone à-dire une zone avec votre polyline avec la tolérance supplémentaire puis utilisez containsLocation. Vous devez remplir le tableau de points qui dessine le polygone désiré. Check this jsfiddle

Vous pouvez également utiliser de la bibliothèque de la géométrie.

isLocationOnEdge (point: LatLng, poly: Polygone | polyligne, de tolérance: Numéro?)

La tolérance est basée sur la précision de la position décimale souhaitée en termes de latitude/longitude
par exemple (44,9875, 35,9812) est sur la polyligne, si la tolérance est 0.00001 alors si vous changez le point en (44.9876, 35.9812) le point sera sur la polyligne.

Un exemple de containsLocation:

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

 
     var triangleCoords = [ 
 
      {lat: 25.774, lng: -80.19}, 
 
      {lat: 18.466, lng: -66.118}, 
 
      {lat: 32.321, lng: -64.757} 
 
     ]; 
 

 
     var bermudaTriangle = new google.maps.Polygon({paths: triangleCoords}); 
 

 
     google.maps.event.addListener(map, 'click', function(e) { 
 
      var resultColor = 
 
       google.maps.geometry.poly.containsLocation(e.latLng, bermudaTriangle) ? 
 
       'blue' : 
 
       'red'; 
 

 
      var resultPath = 
 
       google.maps.geometry.poly.containsLocation(e.latLng, bermudaTriangle) ? 
 
       // A triangle. 
 
       "m 0 -1 l 1 2 -2 0 z" : 
 
       google.maps.SymbolPath.CIRCLE; 
 

 
      new google.maps.Marker({ 
 
      position: e.latLng, 
 
      map: map, 
 
      icon: { 
 
       path: resultPath, 
 
       fillColor: resultColor, 
 
       fillOpacity: .2, 
 
       strokeColor: 'white', 
 
       strokeWeight: .5, 
 
       scale: 10 
 
      } 
 
      }); 
 
     }); 
 
     }

<div id="map"></div> 
 
<script async defer 
 
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&libraries=geometry&callback=initMap"></script>

Example with isLocationOnEdge on jsfiddle

complète source code de pour la migration du serveur