javascript - 如何计算两组经纬度之间的距离

Question

我正在为跟踪应用程序使用react-native-gmaps模块。它是一个轻量级的包，公开了一些方法。

<RNGMap
ref={'gmap'}
style={{ width: this.state.mapWidth, height: this.state.mapHeight }}
markers={this.state.markers}
zoomLevel={this.state.zoom}
onMapChange={(e) => this._handleMapChange(e) }
center={this.state.center}
onMarkerClick={(e) => this._handleMarkerPress(e) }/>

对于放置在 map 上的每个折线点， map 都会重新居中。 (移动 map ，它会弹回到中心)它正在跟随用户。我添加了一个启用/禁用此选项的图标。我想做的是提醒用户这个选项是可用的。我在 map 右侧放置了一个图标。

我想使用

onMapChange

执行此操作的方法。我希望当用户移动 map 时图标改变颜色。(如果 followMe 选项设置为 true)。

    _handleMapChange(e) {

    console.log(e)

    if (this.state.isFollowing) {
        this.setState({ followingIconBackground: colors.rgba.mapBlue })
    TimerMixin.setTimeout.call(this, () => {
        this.setState({ followingIconBackground: colors.rgba.mapGrey })
    }, 100)
    }
}

问题是每次 map 移动时都会触发此方法。所以我需要设置最小纬度/经度距离变化，以防止每次将折线点添加到 map 时触发我的函数。我该如何计算这个？类似的问题似乎对此过于复杂。

所以我认为它会是这样的。但我不知道如何比较或比较什么

    var oldLat;
var oldLng;
_handleMapChange(e) {

    if (compare old with new  )
    if (this.state.isFollowing) {
        this.setState({ followingIconBackground: colors.rgba.mapBlue })
        TimerMixin.setTimeout.call(this, () => {
            this.setState({ followingIconBackground: colors.rgba.mapGrey })
        }, 100)
    }
    oldLat = e.lat
    oldLng = e.lng
}

Answer 1

对于高级地理空间演算，我使用 http://turfjs.org/
(可用于服务器端和前端)

var point1 = {
  "type": "Feature",
  "properties": {},
  "geometry": {
    "type": "Point",
    "coordinates": [-75.343, 39.984]
  }
};
var point2 = {
  "type": "Feature",
  "properties": {},
  "geometry": {
    "type": "Point",
    "coordinates": [-75.534, 39.123]
  }
};
var units = "miles";

var points = {
  "type": "FeatureCollection",
  "features": [point1, point2]
};

//=points

var distance = turf.distance(point1, point2, units);

//=distance

来源: http://turfjs.org/docs/#distance

您需要将点创建为 GeoJson(如上所述)