个人项目 · 地理空间编辑器 · 2026

VECTOR — 高精地图工作台

围绕新加坡真实街道，打造直观、精确的车道、路口与交通信号编辑工具。

可运行原型 · AI 辅助设计与开发

30 秒速览

密集地图数据的编辑，既需要精度，也需要响应速度。移动一个顶点，不应该让整张地图重新构建。

使用 React 与 deck.gl 构建编辑器，包含上下文工具、命令式撤销、Worker 导入和设备本地恢复，以新加坡作为示例工作区。

完成可运行原型、13 项自动化测试，以及百万要素的 CPU 流程基准测试。该规模的浏览器渲染表现尚未验证。

以新加坡为编辑画布

示例覆盖莱佛士坊与直落亚逸。真实的 OpenStreetMap 道路中心线与信号位置提供地理背景；车道边界和路口范围则是可编辑的示意标注。

直接在作品集中探索新加坡街道、绘制车道、移动顶点，并撤销修改。准备好后即可启动编辑器；导入的文件保留在你的设备上。

建议使用桌面浏览器。编辑器仅在点击启动后加载；大屏视图也位于本作品集域名下。打开大屏视图

在同一工作区完成选择、绘制与检查。白色顶点手柄、吸附、快捷键及带名称的撤销步骤，让每次修改都清晰且可逆。

通过要素 ID 直接定位到有界数据块。一次编辑只替换受影响的数据块，保留其他 deck.gl 数据引用及其 GPU 缓冲区。

Worker 分批解析和验证 GeoJSON。取消操作或遇到无效几何时，当前地图保持完整；只有验证通过才替换工作区。

IndexedDB 在本地保存变更的数据块。明确的保存状态和 GeoJSON 导出，为用户提供可恢复的工作区与可携带的备份。

在 macOS、Node v26.4.0 环境的一次 CPU 测试中，处理了采用新加坡坐标的 100 万个混合要素、140 万个顶点，JSON 文件大小为 135.51 MiB。这是单次测量，不代表浏览器帧率或生产容量保证。

该次运行的 Node 堆内存约为 871 MiB。解析仍需读取完整 JSON 文档；Worker 将工作移出界面线程，但不会消除内存开销。

已实现点、线、面绘制、顶点编辑、属性修改、导入导出、撤销重做和本地恢复。多部件几何可导入和管理，但顶点编辑目前仅支持单部件几何。自动化测试、TypeScript、代码检查和生产构建均已通过；浏览器交互与百万要素的 GPU 渲染仍需测试。

后续重点包括浏览器与移动端交互测试、流式导入、二进制几何、空间瓦片及更深入的拓扑验证。示例不是经过测绘的高精地图，不可用于导航。