geo-location-tool

经纬度测距地理工具（Geographic Location Testing Website）

基于 Leaflet + 高德地图瓦片 的纯前端离线坐标拾取、球面测距工具，无后端，数据仅存储在浏览器本地。

✨ 功能清单

1. 地图拾取坐标 点击地图自动获取 WGS84 经纬度，同时展示十进制度 / 度分秒两种格式，一键复制坐标。
2. 两点球面测距 使用 Haversine 大圆距离算法计算地表真实距离，自动绘制两点连线，支持一键清除测距标记。
3. 本地数据持久化
   • 拾取历史记录（最多保存120条，带时间戳，可一键定位回地图点位）
   • 自定义命名收藏点位，支持删除收藏
   • 全部数据存储在浏览器 localStorage，不上传任何服务器
4. 数据备份与恢复 导出全部历史、收藏为 JSON 文件备份；支持导入 JSON 恢复记录。
5. 移动端自适应 手机竖屏控制面板底部、横屏自动适配，兼容刘海屏安全区，触摸按钮放大防误触。

📁 项目文件结构

🚀 本地运行方法

方式1：推荐 VSCode Live Server

1. VSCode 安装插件 Live Server
2. 打开项目文件夹，右下角点击 Go Live，自动打开网页

方式2：直接浏览器打开

找到 index.html 文件，双击使用 Chrome / Edge 浏览器打开（需要联网加载地图资源）

🌐 在线访问（GitHub Pages）

本项目部署在 GitHub Pages，访问地址： https://你的github用户名.github.io/你的仓库名/

📖 使用说明

1. 拾取坐标模式（默认） 点击地图任意位置，自动记录点位到历史，可复制、加入收藏。
2. 两点测距模式 切换单选框到「两点测距」，第一次点击为起点A，第二次点击为终点B，自动计算直线地表距离。
3. 历史/收藏列表点击「定位」可快速跳转至对应坐标；支持清空历史、删除收藏。
4. 底部导出/导入按钮可备份迁移你的坐标记录。

🛠️ 技术栈

• 地图框架：Leaflet 1.9.4（国内 BootCDN 加速）
• 地图瓦片：高德矢量地图（国内访问稳定）
• 存储：浏览器 localStorage
• 前端：原生 HTML / CSS / JavaScript，无任何框架依赖

⚠️ 注意事项

1. 必须联网才能加载地图底图与地图库；
2. 无痕浏览器窗口关闭后会清空所有本地记录，建议使用普通窗口；
3. 坐标系标准 WGS84（GPS通用），高德/百度地图需自行坐标转换；
4. 清除浏览器站点数据会删除全部历史与收藏记录，导出JSON可提前备份。