当前位置：首页 > JavaScript

js实现测距

2026-02-02 10:15:10JavaScript

使用Geolocation API获取位置信息

通过浏览器内置的Geolocation API可以获取用户当前位置的经纬度坐标。该API需要用户授权，适用于网页端实现测距功能。

navigator.geolocation.getCurrentPosition(
  (position) => {
    const lat = position.coords.latitude;
    const lng = position.coords.longitude;
    console.log(`当前位置: ${lat}, ${lng}`);
  },
  (error) => {
    console.error("获取位置失败:", error.message);
  }
);

计算两点间距离（Haversine公式）

已知两个点的经纬度坐标时，可通过Haversine公式计算球面距离。该公式考虑了地球曲率，精度较高。

function calculateDistance(lat1, lon1, lat2, lon2) {
  const R = 6371; // 地球半径（公里）
  const dLat = (lat2 - lat1) * Math.PI / 180;
  const dLon = (lon2 - lon1) * Math.PI / 180;
  const a = 
    Math.sin(dLat/2) * Math.sin(dLat/2) +
    Math.cos(lat1 * Math.PI / 180) * 
    Math.cos(lat2 * Math.PI / 180) *
    Math.sin(dLon/2) * Math.sin(dLon/2);
  const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
  return R * c; // 返回公里数
}

结合地图API实现可视化测距

使用Google Maps API或百度地图API等可实现可视化测距功能。以下是Google Maps的示例：

// 初始化地图
const map = new google.maps.Map(document.getElementById("map"), {
  zoom: 4,
  center: { lat: 39.9042, lng: 116.4074 } // 北京坐标
});

// 创建测距工具
const distanceService = new google.maps.DistanceMatrixService();
distanceService.getDistanceMatrix({
  origins: ["北京市"],
  destinations: ["上海市"],
  travelMode: "DRIVING",
}, (response) => {
  console.log(response.rows[0].elements[0].distance.text);
});

使用WebRTC实现设备间测距

通过WebRTC的RTCPeerConnection可以估算设备间的网络延迟，进而推算大致距离（精度较低）：

js实现测距

const pc = new RTCPeerConnection();
pc.createDataChannel("distance");
pc.onicecandidate = (e) => {
  if (e.candidate) {
    // 通过ICE候选信息估算延迟
    const rtt = estimateRoundTripTime(e.candidate);
    const distance = rtt * 0.5 * 200; // 简化估算公式
  }
};