如何获取Google Maps折线路径中被点击点的索引？

Google Maps的折线点击事件对象本身不会直接返回被点击路径点的索引，你需要通过计算点击位置与折线所有路径点的距离，找到最近的点来确定索引，具体实现如下：

localPolyLine.addListener('click', (e) => {
  // 获取折线的完整路径点集合
  const path = localPolyLine.getPath();
  let closestIndex = -1;
  let minDistance = Infinity;

  // 遍历每个路径点，计算与点击坐标的距离
  for (let i = 0; i < path.getLength(); i++) {
    const currentPoint = path.getAt(i);
    // 使用几何库计算两点间的球面距离（单位：米）
    const distance = google.maps.geometry.spherical.computeDistanceBetween(e.latLng, currentPoint);

    // 更新最近点的索引和最小距离
    if (distance < minDistance) {
      minDistance = distance;
      closestIndex = i;
    }
  }

  // 输出结果，closestIndex即为最接近点击位置的路径点索引
  console.log('目标路径点索引：', closestIndex);
});

注意事项 #

• 必须确保加载Google Maps时引入了几何库，在地图API的URL中添加&libraries=geometry参数，否则computeDistanceBetween方法无法使用。
• 可以根据实际需求添加距离阈值，比如仅当minDistance小于10米时才判定为点击了路径点，避免因点击位置离所有点过远导致的误判。

内容的提问来源于stack exchange，提问作者vagelis