查找一个经纬度坐标是否在另外两个经纬度坐标之间。

Question

查找一个经纬度坐标是否在另外两个经纬度坐标之间。

javascriptgoogle-mapsmathcoordinatesgeospatial

5

目标

判断一个坐标点是否在两个其它的坐标点之间。

背景

我正在制作一个谷歌地图应用程序，需要知道一个特定的点是否在两个经纬度（起点和终点）之间。

我正在寻找下面这样的函数：

var currentCoord = {lat: 51.8732, lng: -118.6346};
var startCoord = {lat: 61.3434, lng: -118.0046};
var endCoord = {lat: 50.5468, lng: -118.5435};

function isBetween(startCoord, endCoord, currentCoord){
    //calculations here
    return "true if currentCoord is between startCoord and endCoord, or false otherwise";
}

我尝试过的方法

为了达到这个目的，我阅读了几篇问题和帖子：

check coordinate exists between two points of line 看起来很有前途，但由于它只针对网格中的X和Y点，并且没有考虑地球曲率和其他方面，所以它不起作用。而且，它已经关闭了...
Check coordinate point between two points 可能也是我在寻找的东西，但是目前还没有答案，而且问题中的代码也无法工作。如果可能的话，我也想避免一连串的if语句。
Check if a point projected on a line segment is not outside it 也是我检查过的内容，但是不幸的是目标是不同的，我无法将答案调整为我所寻找的内容。
最后，http://www.movable-type.co.uk/scripts/latlong.html 是一个坐标资产的巨大库，但我无法看到它们中的任何一个如何帮助我

代码

无论我尝试什么，我都无法让它工作，但是我有一个带有我的失败实验的最小示例：

"use strict";

/*global google*/

function initialize() {

  let mapOptions = {
    zoom: 3,
    center: new google.maps.LatLng(0, -180),
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };

  let map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);

  let flightPlanCoordinates = [
    new google.maps.LatLng(37.772323, -122.214897),
    new google.maps.LatLng(21.291982, -157.821856),
    new google.maps.LatLng(-18.142599, 178.431),
    new google.maps.LatLng(-27.46758, 153.027892)
  ];

  let flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    geodesic: true,
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  flightPath.setMap(map);

  google.maps.event.addListener(flightPath, 'mouseover', function(event) {
    console.log("Marker is over the polyline");
  });

  let marker = new google.maps.Marker({
    position: new google.maps.LatLng(37.772323, -122.214897),
    draggable: true,
    map: map,
    title: 'Drag me!'
  });

  marker.addListener('drag', function(event) {

    let startPoint = {
      lat: 37.772323,
      lng: -122.214897
    };
    let endPoint = {
      lat: 21.291982,
      lng: -157.821856
    };
    let currentPoint = {
      lat: marker.getPosition().lat(),
      lng: marker.getPosition().lng()
    };

    if (checkCoordinate(startPoint, endPoint, currentPoint))
      console.log("in line !");
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

function checkCoordinate(start, end, point) {
  var slope = (end.lng - start.lng) / (end.lat - start.lat);
  var newSlope = (end.lng - point.lng) / (end.lat - point.lat);
  return (point.lat > start.lat && point.lat < end.lat && point.lng > start.lng && point.lng < end.lng && slope == newSlope);
}

html,
body,
#map-canvas {
  height: 100%;
  margin: 0px;
  padding: 0px
}

<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <title>Simple Polylines</title>
  <link rel="stylesheet" type="text/css" href="style.css">
  <script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
  <script src="script.js" type="text/javascript"></script>
</head>

<body>
  <div id="map-canvas"></div>
</body>

</html>

问题

如何通过数学方法确定一个给定坐标是否在两个坐标之间？

- Flame_Phoenix

虽然这是 Java 代码，但你可能想看一下来自 Google 地图 API 实用程序库的 PolyUtil.isLocationOnPath 方法。https://github.com/googlemaps/android-maps-utils/blob/master/library/src/com/google/maps/android/PolyUtil.java - antonio

3个回答

0

我已经找到了一个解决方案，通过计算一个点是否属于一条直线。

在研究了许多数学原理之后，我决定计算两个点之间的矩阵行列式，并检查（以一定的精度）我的给定点是否在点A和B的连线之间。

/**
 * @const
 * @type        {Number}
 * @description The precision to calculate if a given point is between two other points. Low precisions get precise results but are less forgiving against errors.
 */
const PRECISION = 1;

/**
 * @function    isBetween
 * @description Determines if a point P = (p.x, p.y) lies on the line connecting points S = (S.x, S.y) and E = (E.x, E.y) by calculating the determinant of the matrix. A point is considered to belong to the line if the precision of the calculation is small enough (tests for errors and loss of precision).
 * @param       {Point} start   The start point
 * @param       {Point} end     The end point
 * @param       {Point} point   The point we which to test.
 * @returns     <code>true</code> if the given point belongs to the line, <code>false</code> otherwise.
 * @see         {@link https://dev59.com/9HNA5IYBdhLWcg3wku3O#907491|Distance Matrix Calculation}
 */
function isBetween(start, end, point) {
    return Math.abs((end.lat - start.lat) * (point.lng - start.lng) - (end.lng - start.lng) * (point.lat - start.lat)) < PRECISION;
}

然而，这种解决方案有一个值得一提的缺陷。这个解决方案的问题在于它没有考虑到地球的曲率。它只适用于直线。

因此，如果你正在检查你所在城镇的距离，这可能根本不重要。但是，如果你正在飞越太平洋，你应该使用另一种数学方法。

出于这个原因，并且因为折线已经考虑了地球的曲率，我决定使用geocodezip的答案。

附言：我必须说这很有趣。几个小时前，我回答了一个旧问题，在那里我还感谢geocodezip给出的深刻评论，现在他在这里回答我的问题。有时候，我确实相信这个世界是一个小地方。谢谢你！

- Flame_Phoenix

0

使用来自http://www.movable-type.co.uk/scripts/latlong.html页面的方位角部分，您可以轻松检查它

bearing(from currentCoord to startCoord) = 
  bearing(from currentCoord to endCoord) +/- 180 (with some tolerance)

这个方程表示所有三个点都在同一条大圆弧上

（我假设你的“位于另外两个坐标之间”具有相同的含义）

- MBo

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- geocodezip · Accepted Answer

一种选择是使用google.maps.geometry.poly.isLocationOnEdge方法。 代码片段：

var map;

function initialize() {

  var mapOptions = {
    zoom: 2,
    center: new google.maps.LatLng(0, -180),
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };

  map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);

  var flightPlanCoordinates = [
    new google.maps.LatLng(37.772323, -122.214897),
    new google.maps.LatLng(21.291982, -157.821856),
    new google.maps.LatLng(-18.142599, 178.431),
    new google.maps.LatLng(-27.46758, 153.027892)
  ];

  var flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    geodesic: false,
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  flightPath.setMap(map);

  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(37.772323, -122.214897),
    draggable: true,
    map: map,
    title: 'Drag me!'
  });

  marker.addListener('dragend', function(event) {

    var startPoint = {
      lat: 37.772323,
      lng: -122.214897
    };
    var startMarker = new google.maps.Marker({
      position: startPoint,
      map: map
    });
    var endPoint = {
      lat: 21.291982,
      lng: -157.821856
    };
    var endMarker = new google.maps.Marker({
      position: endPoint,
      map: map
    });
    var currentPoint = {
      lat: marker.getPosition().lat(),
      lng: marker.getPosition().lng()
    };

    if (checkCoordinate(startPoint, endPoint, marker.getPosition()))
      console.log("in line !");
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

function checkCoordinate(start, end, point) {
  return google.maps.geometry.poly.isLocationOnEdge(point, new google.maps.Polyline({
    map: map,
    path: [start, end]
  }), 10e-1);
}

html,
body,
#map-canvas {
  height: 100%;
  margin: 0px;
  padding: 0px
}

<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <title>Simple Polylines</title>
  <link rel="stylesheet" type="text/css" href="style.css">
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
  <script src="script.js" type="text/javascript"></script>
</head>

<body>
  <div id="map-canvas"></div>
</body>

</html>