NS_unknown_game/tools/map_editor/README.md

地图编辑器

这是一个静态网页地图编辑器，用来编辑游戏使用的 .map 文本文件。

本地运行

在仓库根目录执行：

python -m http.server 8787

然后打开：

http://127.0.0.1:8787/tools/map_editor/

从仓库根目录启动静态服务时，编辑器可以自动读取 game/assets/map/stage_01.map。也可以通过“打开 .map”选择任意 .map 文件。

当前能力

• 打开 .map 文本文件。
• 可视化世界范围、摄像机范围、玩家出生点、碰撞块、场景矩形、铺砖区、战斗区和敌人出生点。
• 从画布或对象列表选择对象。
• 在画布上拖动对象，支持网格吸附。
• 通过“编辑目标”过滤画布选择对象，默认“智能选择”会优先选中铺砖区和图形，避免被重叠碰撞块挡住。
• 选中矩形对象后，拖动右下角蓝色手柄可以调整宽高。
• 通过“导入图形”选择图片，自动生成一个 rect_sprite 图形对象和一个同尺寸 collision。
• 导入的图形会在浏览器内临时预览，拖动或缩放图形时，同步移动或缩放绑定的碰撞块。
• 编辑选中对象的数值和文本属性。
• 新增/删除图块集、图层、碰撞块、铺砖区、战斗区和出生点。
• 支持撤回最近编辑操作，也可以使用 Ctrl+Z。
• 选中图层或图层内对象后，可以把对应图层上移或下移。
• 保存并下载兼容 StageMapLoader 的 .map 文本。

保存和撤回

• “保存并下载”会把右侧导出文本下载成 <地图ID>.map。
• 浏览器安全限制下，静态网页不能直接覆盖本地项目文件；下载后仍需要替换项目里的地图文件。
• “撤回”会恢复最近一次地图编辑操作，包括新增、删除、拖动、缩放、属性修改、导入图形和图层移动。
• 打开或重新加载 .map 会清空撤回历史。

调整碰撞块

1. 在左侧“编辑目标”里选择“碰撞块”。
2. 在画布上点击红色碰撞框，或从对象列表选择对应碰撞块。
3. 拖动碰撞块本体可以移动位置。
4. 拖动右下角蓝色手柄可以调整宽高。
5. 也可以在右侧属性面板直接修改 X、Y、W、H。

调整铺砖区

1. 在左侧“编辑目标”里选择“智能选择”或“铺砖区”。
2. 在画布上点击铺砖区，或从对象列表选择对应铺砖区。
3. 拖动铺砖区本体可以移动位置。
4. 拖动右下角蓝色手柄可以调整列数和行数。
5. 如果要编辑同位置碰撞体，再把“编辑目标”切到“碰撞块”。

导入和调整图形

1. 点击左侧“导入图形”，选择一个图片素材。
2. 编辑器会把它添加到 PropsBack 图层，并在同一位置创建同尺寸碰撞块。
3. 新图形会自动选中，左侧“编辑目标”会切到“场景矩形”。
4. 拖动图形本体可以移动图形和绑定碰撞块。
5. 拖动右下角蓝色手柄可以调整图形和绑定碰撞块尺寸。
6. 也可以在右侧属性面板修改 X、Y、W、H、颜色和贴图路径。

静态网页不能自动把图片复制进项目目录。导入后 .map 默认写入：

assets/stage/stage_01/props/<图片文件名>

实际运行游戏前，需要把图片素材放到这个路径下。

调整图层顺序

1. 在对象列表中选择一个图层，或选择该图层下的图形/铺砖区。
2. 点击右侧“图层上移”或“图层下移”。
3. 编辑器会按当前图层顺序预览和导出 .map。

当前限制

• 浏览器安全限制不允许静态网页直接覆盖本地源文件。当前需要先下载 .map，再手动替换项目里的地图文件；部署到服务器后可以增加服务端保存接口。
• 已导入图形的预览只在当前浏览器会话内有效；重新打开 .map 后，如果浏览器没有重新选择图片，图形会用颜色块显示。
• 暂未实现图块集图片预览，铺砖区当前使用 fallback 颜色显示。
• 暂未实现重做和多选。