零基础5分钟上手GeoJSON.io在浏览器里画地图、改空间数据、一键分享【免费下载链接】geojson.ioA quick, simple tool for creating, viewing, and sharing spatial data项目地址: https://gitcode.com/gh_mirrors/ge/geojson.io周五下午你收到一张写满门店经纬度的Excel表格老板要求10分钟内把它变成一张能看懂的地图。装QGIS太笨重ArcGIS要授权现学Python更是来不及——这正是GeoJSON.io出场的时候。这个免费开源的地图数据编辑器完全运行在浏览器里把CSV、KML、Shapefile等文件拖进网页几秒钟就变成地图上的点、线、面还能顺手编辑、美化、导出。它不要求任何编程基础是零基础用户快速完成空间数据可视化与分享的入门利器。它到底是什么一句话亮点清单GeoJSON.io 是一个跑在浏览器里的空间数据编辑器。你可以把它想象成地图版的在线表格——表格里每一行数据对应地图上一个看得见、摸得着的点、线或面。它由地图圈的老牌团队发起维护经过十几年迭代和完全重构目前基于 Mapbox GL 与 React 技术栈界面更现代、响应更快。它的核心亮点5条就够记住打开即用不需要下载安装包不需要配置数据库打开页面就能干活格式兼容广GeoJSON、CSV、KML/KMZ、GPX、Shapefile、TopoJSON、WKT 等近20种格式互转绘图工具齐全点、线、多边形、矩形、圆鼠标点两下就能画出要素批量编辑不头疼属性面板和表格视图双通道改100条数据和改1条一样快完全开源免费自己部署也只需要一条 clone 命令5分钟做出你的第一张地图别急着看说明书跟着下面5步走第一张地图马上出炉。第一步准备一个数据文件。打开 Excel随便填两列坐标第一列是经度lon第二列是纬度lat另存为CSV。没有数据也没关系直接打开空地图也一样能画。第二步把文件拖进窗口。这是最爽的一步——像把照片拖进微信一样把CSV拖到页面里松手。程序会自动识别格式提示你确认哪一列是经度、哪一列是纬度。第三步动手画几个要素。左侧工具栏点选点工具在地图上单击就是一个小点换成多边形工具连续点击围出一个范围双击收尾。你画的不只是图形而是带坐标的正式数据。第四步在右侧面板补上属性。点中某个要素右侧会弹出它的属性表。给这个点起个名字、填个数字备注就像给相册里的照片写标签。属性会跟着图形一起保存导出时不丢。第五步导出带走。按CtrlShiftS打开导出窗口选 GeoJSON、KML 或 CSV保存到本地。一份能直接交给开发同事、也能扔进其他地图软件的数据就到手了。从拖入文件到导出结果熟练后整个过程用不了5分钟。接下来我们把同样5分钟套到3个真实场景里。3个拿来即用的高频场景场景一把一表坐标变成门店分布图目标手上有一份几十家门店的地址表格想一眼看清覆盖范围操作拖入CSV → 确认经纬度列 → 在地图上缩放浏览 → 用不同颜色区分直营和加盟在样式面板里改成果一份能直接放进汇报PPT的分布图还附带了可导出的精确坐标数据场景二给同事圈出配送范围目标为3个仓库各画一个服务半径示意操作点选多边形工具沿边界描一圈 → 在右侧属性里填上仓库A、容量、负责人 → 调整填充颜色和透明度让地图清爽成果对方不用装任何软件就能在浏览器里查看、缩放、点击查看每个区域的信息场景三当格式翻译官用目标客户发来KML但开发只要GeoJSON操作拖入KML → 确认转换预览 → 导出GeoJSON成果格式转换零成本完成KML、GPX、Shapefile、TopoJSON 等格式之间都能这么互转转换逻辑统一由app/lib/convert/目录下的驱动模块处理进阶玩法别错过这些提效开关基础功能只能让你能用下面这4个开关能让你用得飞快。表格视图批量编辑。点击右侧面板顶部的 Table 标签所有要素立刻变成一张真正的表格可以像操作Excel一样排序、筛选、批量改属性。给100个点统一加一个区域字段表格视图里填一列就搞定。相关实现集中在app/components/panels/feature_table/。空间操作全家桶。选中多个要素后你可以执行合并、分割、求交集、生成凸包、画缓冲区等操作这些逻辑封装在app/lib/map_operations/里。比如给一批点位一键生成覆盖范围的缓冲区或者把相邻多边形合并成一个大区。快捷键是隐藏的效率神器。CtrlZ撤销、CtrlY重做、Delete删除选中要素、CtrlA全选、CtrlK呼出快速搜索框、按住空格键拖动可整体移动要素。这几个键记熟操作速度至少翻一倍。大文件交给后台线程。导入超大文件时解析和转换会放到 Web Worker 里异步执行见app/lib/worker/界面不卡死还有进度条告诉你还要等多久。几万条记录的文件也能平稳处理。新手最容易踩的4个坑问CSV拖进去点全部跑到了非洲海岸答多半是经纬度列认反了。程序默认经度、纬度的顺序如果你的表格是纬度在前在导入确认框里切换顺序即可也可以直接在导入选项里指定LONLAT或LATLON。问文件拖进去提示无法识别格式答检查文件扩展名和内容是否匹配比如明明是JSON内容却存成了 .txt。另外CSV的列分隔符可能是分号或制表符在导入选项里切换分隔符再试一次。问画好的多边形看起来破了或者朝向不对答这是坐标环方向问题常见于从其他工具拷来的数据。GeoJSON.io 内部带自动纠正环方向的处理geojson-rewind导出时也可以勾选按标准规范修正一般重新导出即可。问导入大文件后地图半天没反应答耐心等右上角进度条走完处理期间不要重复拖入。如果实在太大建议先切分文件分批导入或只保留需要的字段。从使用者到贡献者如果你想把 GeoJSON.io 部署到自己的服务器或者想改改它的界面克隆下来即可git clone https://gitcode.com/gh_mirrors/ge/geojson.io cd geojson.io npm install复制.env.example为.env填入你的 Mapbox 公开令牌然后npm run dev启动开发服务器浏览器打开http://localhost:5173就能访问自己的实例了。项目结构并不复杂逛起来很容易上手app/components/全部界面组件地图区、属性面板、各类对话框都在这里app/lib/convert/近20种文件格式的导入导出驱动app/lib/map_operations/合并、分割、缓冲区等空间操作app/hooks/各类可复用的React逻辑state/应用状态管理遇到问题或有了新想法到仓库的 Issues 页面提交即可社区维护活跃。给项目提一个需求也许下一次更新里就藏着你的点子。现在就去试试你不需要记住任何一个专业名词只需要把那份躺在桌面上的坐标表格拖进浏览器。地图会替你说完所有的话数据会替你省下所有的时间——GeoJSON.io 就是那个把地理信息从专家实验室搬到普通桌面的一扇窗。打开它拖入你的第一份数据你会发现地图原来可以这么简单。【免费下载链接】geojson.ioA quick, simple tool for creating, viewing, and sharing spatial data项目地址: https://gitcode.com/gh_mirrors/ge/geojson.io创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 零基础5分钟上手GeoJSON.io：在浏览器里画地图、改空间数据、一键分享
零基础5分钟上手GeoJSON.io在浏览器里画地图、改空间数据、一键分享【免费下载链接】geojson.ioA quick, simple tool for creating, viewing, and sharing spatial data项目地址: https://gitcode.com/gh_mirrors/ge/geojson.io周五下午你收到一张写满门店经纬度的Excel表格老板要求10分钟内把它变成一张能看懂的地图。装QGIS太笨重ArcGIS要授权现学Python更是来不及——这正是GeoJSON.io出场的时候。这个免费开源的地图数据编辑器完全运行在浏览器里把CSV、KML、Shapefile等文件拖进网页几秒钟就变成地图上的点、线、面还能顺手编辑、美化、导出。它不要求任何编程基础是零基础用户快速完成空间数据可视化与分享的入门利器。它到底是什么一句话亮点清单GeoJSON.io 是一个跑在浏览器里的空间数据编辑器。你可以把它想象成地图版的在线表格——表格里每一行数据对应地图上一个看得见、摸得着的点、线或面。它由地图圈的老牌团队发起维护经过十几年迭代和完全重构目前基于 Mapbox GL 与 React 技术栈界面更现代、响应更快。它的核心亮点5条就够记住打开即用不需要下载安装包不需要配置数据库打开页面就能干活格式兼容广GeoJSON、CSV、KML/KMZ、GPX、Shapefile、TopoJSON、WKT 等近20种格式互转绘图工具齐全点、线、多边形、矩形、圆鼠标点两下就能画出要素批量编辑不头疼属性面板和表格视图双通道改100条数据和改1条一样快完全开源免费自己部署也只需要一条 clone 命令5分钟做出你的第一张地图别急着看说明书跟着下面5步走第一张地图马上出炉。第一步准备一个数据文件。打开 Excel随便填两列坐标第一列是经度lon第二列是纬度lat另存为CSV。没有数据也没关系直接打开空地图也一样能画。第二步把文件拖进窗口。这是最爽的一步——像把照片拖进微信一样把CSV拖到页面里松手。程序会自动识别格式提示你确认哪一列是经度、哪一列是纬度。第三步动手画几个要素。左侧工具栏点选点工具在地图上单击就是一个小点换成多边形工具连续点击围出一个范围双击收尾。你画的不只是图形而是带坐标的正式数据。第四步在右侧面板补上属性。点中某个要素右侧会弹出它的属性表。给这个点起个名字、填个数字备注就像给相册里的照片写标签。属性会跟着图形一起保存导出时不丢。第五步导出带走。按CtrlShiftS打开导出窗口选 GeoJSON、KML 或 CSV保存到本地。一份能直接交给开发同事、也能扔进其他地图软件的数据就到手了。从拖入文件到导出结果熟练后整个过程用不了5分钟。接下来我们把同样5分钟套到3个真实场景里。3个拿来即用的高频场景场景一把一表坐标变成门店分布图目标手上有一份几十家门店的地址表格想一眼看清覆盖范围操作拖入CSV → 确认经纬度列 → 在地图上缩放浏览 → 用不同颜色区分直营和加盟在样式面板里改成果一份能直接放进汇报PPT的分布图还附带了可导出的精确坐标数据场景二给同事圈出配送范围目标为3个仓库各画一个服务半径示意操作点选多边形工具沿边界描一圈 → 在右侧属性里填上仓库A、容量、负责人 → 调整填充颜色和透明度让地图清爽成果对方不用装任何软件就能在浏览器里查看、缩放、点击查看每个区域的信息场景三当格式翻译官用目标客户发来KML但开发只要GeoJSON操作拖入KML → 确认转换预览 → 导出GeoJSON成果格式转换零成本完成KML、GPX、Shapefile、TopoJSON 等格式之间都能这么互转转换逻辑统一由app/lib/convert/目录下的驱动模块处理进阶玩法别错过这些提效开关基础功能只能让你能用下面这4个开关能让你用得飞快。表格视图批量编辑。点击右侧面板顶部的 Table 标签所有要素立刻变成一张真正的表格可以像操作Excel一样排序、筛选、批量改属性。给100个点统一加一个区域字段表格视图里填一列就搞定。相关实现集中在app/components/panels/feature_table/。空间操作全家桶。选中多个要素后你可以执行合并、分割、求交集、生成凸包、画缓冲区等操作这些逻辑封装在app/lib/map_operations/里。比如给一批点位一键生成覆盖范围的缓冲区或者把相邻多边形合并成一个大区。快捷键是隐藏的效率神器。CtrlZ撤销、CtrlY重做、Delete删除选中要素、CtrlA全选、CtrlK呼出快速搜索框、按住空格键拖动可整体移动要素。这几个键记熟操作速度至少翻一倍。大文件交给后台线程。导入超大文件时解析和转换会放到 Web Worker 里异步执行见app/lib/worker/界面不卡死还有进度条告诉你还要等多久。几万条记录的文件也能平稳处理。新手最容易踩的4个坑问CSV拖进去点全部跑到了非洲海岸答多半是经纬度列认反了。程序默认经度、纬度的顺序如果你的表格是纬度在前在导入确认框里切换顺序即可也可以直接在导入选项里指定LONLAT或LATLON。问文件拖进去提示无法识别格式答检查文件扩展名和内容是否匹配比如明明是JSON内容却存成了 .txt。另外CSV的列分隔符可能是分号或制表符在导入选项里切换分隔符再试一次。问画好的多边形看起来破了或者朝向不对答这是坐标环方向问题常见于从其他工具拷来的数据。GeoJSON.io 内部带自动纠正环方向的处理geojson-rewind导出时也可以勾选按标准规范修正一般重新导出即可。问导入大文件后地图半天没反应答耐心等右上角进度条走完处理期间不要重复拖入。如果实在太大建议先切分文件分批导入或只保留需要的字段。从使用者到贡献者如果你想把 GeoJSON.io 部署到自己的服务器或者想改改它的界面克隆下来即可git clone https://gitcode.com/gh_mirrors/ge/geojson.io cd geojson.io npm install复制.env.example为.env填入你的 Mapbox 公开令牌然后npm run dev启动开发服务器浏览器打开http://localhost:5173就能访问自己的实例了。项目结构并不复杂逛起来很容易上手app/components/全部界面组件地图区、属性面板、各类对话框都在这里app/lib/convert/近20种文件格式的导入导出驱动app/lib/map_operations/合并、分割、缓冲区等空间操作app/hooks/各类可复用的React逻辑state/应用状态管理遇到问题或有了新想法到仓库的 Issues 页面提交即可社区维护活跃。给项目提一个需求也许下一次更新里就藏着你的点子。现在就去试试你不需要记住任何一个专业名词只需要把那份躺在桌面上的坐标表格拖进浏览器。地图会替你说完所有的话数据会替你省下所有的时间——GeoJSON.io 就是那个把地理信息从专家实验室搬到普通桌面的一扇窗。打开它拖入你的第一份数据你会发现地图原来可以这么简单。【免费下载链接】geojson.ioA quick, simple tool for creating, viewing, and sharing spatial data项目地址: https://gitcode.com/gh_mirrors/ge/geojson.io创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考