Question

我正在使用传单在地图上进行实时用户跟踪。我将圆圈绘制为所有用户的边界。如果用户超出边界，我需要提醒消息。我正在跟踪用户。只有我需要提醒用户的信息超出界限。

var shipLayer = L.layerGroup();
var ships = L.icon({
  iconUrl: 'images/marker.png',
  iconSize: [16, 20]
});
var popup;
var region;
var fen = {
  lat: "17.4468",
  lng: "78.3922"
};
var i = 1;
var realtime = L.realtime(

  function(success, error) {
    var ship = mockShip();
    success(ship);
  }, {
    interval: refresh * 1000,
    getFeatureId: function(featureData) {
      return featureData.properties.userName;
    },
    pointToLayer: function(feature, latlng) {
      region = '';
      if (typeof ship === "undefined" || ship === null) {
        var title = feature.properties.userName + " - " + feature.properties.gpsTime;
        popup = L.popup()
          .setLatLng(latlng)
          .setContent(feature.properties.userName + '<br/>' + feature.properties.gpsTime + '<br/>BatteryInfo:' + feature.properties.batteryInfo + '%')
          .openOn(map);
        marker = L.marker(latlng, {
          title: title,
          icon: ships
        });
        // this is my code for alert
        if (fen.lat < feature.properties.latitude && fen.lng < feature.properties.longitude) {
          alert('hi');
        }
        //end
        region = L.circle(fen, 450, {
          color: 'red',
          fillColor: '#f03',
          fillOpacity: 0
        }).addTo(map);
        marker.bindPopup(popup);
        marker.on('mouseover', function(e) {
          this.openPopup();
        });
        marker.on('mouseout', function(e) {
          this.closePopup();
        });
        marker.addTo(shipLayer);
        return marker;
      }
    }
  }).addTo(map);

Answer 1

您可以使用distanceTo L.LatLng方法计算两个坐标之间的距离：

返回使用Haversine公式计算的给定LatLng的距离（以米为单位）。

http://leafletjs.com/reference.html#latlng-distanceto

// Get L.LatLng object of the circle
var circleLatLng = circle.getLatLng();

// Get L.LatLng object of the marker
var markerLatLng = marker.getLatLng();

// Calculate distance:
var distance = circleLatLng.distanceTo(markerLatLng);

// Use distance in a condition:
if (distance > 450) {
    // Out of bounds, do stuff
}

Answer 2

使用turf.js可以很容易地做到这一点：

marker = L.marker(latlng, {
  title: title,
  icon: ships
});
region = L.circle(fen, 450, {
  color: 'red',
  fillColor: '#f03',
  fillOpacity: 0
}).addTo(map);
if (turf.distance(marker.toGeoJSON(), region.toGeoJSON()) * 1000 > 450) {
  alert('You are outside the circle!');
}

turf.distance将返回两个GeoJSON点之间的距离。结果在此处乘以1000，因为L.circle使用米为半径，而turf.distance默认为千米。这是一个简单的小提琴，显示了这一点：

http://jsfiddle.net/nathansnider/nv2tL6mz/

当您在圈子外单击时，将触发警报。

小册子实时拉出圆圈边界警报

2 个答案: