本工具专为生成符合学术发表标准（高分辨率、衬线字体、严谨排版）的地理信息图表而设计。本手册将指导您从零开始，制作出一张完美的论文插图。
1. 核心工作流概览
制作一张图表通常遵循以下五个步骤：
- 准备底图：上传您的地图文件（推荐 SVG 矢量图）。
- 底图校准：调整底图的位置、大小、旋转角度及透明度。
- 数据标注：添加、编辑、拖拽城市标签和连线，使其指向正确位置。
- 视觉微调：调整线条颜色、修复 SVG 黑屏问题、应用滤镜。
- 导出成品：下载 300 DPI 高清图片用于论文。
2. 功能模块详解
A. 顶部控制栏 (Main Controls)
这是您的指挥中心，包含最常用的操作按钮。
- 📷 上传底图 (SVG 最佳)
作用：点击后选择本地文件。
支持格式：.svg (推荐，无限放大不失真)、.png、.jpg。
提示：上传后，之前的画布内容会被清空。如果是 SVG 文件，会自动激活“SVG 样式覆写”面板。
- 🌐 找 SVG 地图
作用：点击打开 mapsvg.com，这是一个提供高质量免费矢量地图的资源网站。您可以在那里下载 SVG 地图并上传到本工具。
- ➕ 添加新标注
作用：在画布中央生成一个新的“城市数据组”。
包含内容：一个可拖拽的文字框、一条折线、一个可拖拽的地图定位点（黑点）。
- 🔓 调整底图 (复选框)
作用：这是最重要的开关！
勾选时：进入“底图编辑模式”。此时无法操作文字框，但可以拖拽、缩放、旋转底图图片。底图周围会出现蓝色虚线框。
不勾选时：底图被锁定。此时可以安全地拖拽文字框和连线，不用担心误触底图。
操作技巧：鼠标滚轮可缩放底图；鼠标左键按住底图任意位置可平移。
- ↺ 重置视图
作用：如果您把底图拖丢了或缩放得太小找不到了，点击此按钮可将底图恢复到初始状态（居中、无旋转、100%大小）。
- 📤 导出 (高清 PNG / JPG)
作用：生成最终图片。
智能特性：点击瞬间，系统会自动隐藏所有编辑界面的杂物（如红色的删除叉号、虚线框、按钮等），只保留纯净的图表内容进行截图。
分辨率：默认按照 3倍缩放 (Scale 3.0) 导出，确保文字在 Word/PDF 中放大查看依然清晰。
B. 属性调整面板 (Control Panels)
位于顶部的灰色区域，包含三个子面板。
1. 📐 位置与大小 (Transform)
- 缩放 (Scale)：0.1x 到 5.0x。除了用滚轮，也可以用这个滑块精细控制底图大小。
- 旋转 (Rotate)：-180° 到 180°。如果您的扫描件地图是歪的，用这个校正。
- 透明度 (Opacity)：0% 到 100%。实用技巧：将透明度调低（如 50%），可以更容易看清黑色的连线和文字框，方便对齐。对齐完成后再调回 100%。
2. ✒️ SVG 样式覆写 (SVG Style) - 仅 SVG 模式下可用
- ✨ 一键线框化 (Fix Black)：神器！ 很多 SVG 地图默认是黑色填充的，上传后是一团黑。点击此按钮，瞬间将其变为“白底黑线”的学术风格。
- 描边 (Stroke)：调节地图轮廓线的颜色和粗细。建议使用深灰色（#333333）和 0.5px - 1.0px 的粗细。
- 填充 (Fill)：调节地图板块的颜色。勾选“无填充”可使地图透明（只显示轮廓）。
3. 🎨 通用滤镜 (Filters)
- 灰度 (Grayscale)：将彩色地图一键转为黑白。适合黑白印刷的期刊要求。
- 对比度 (Contrast)：增强线条清晰度。
- 反色 (Invert)：如果底图是深色的（如夜间模式地图），用这个反转成白底黑字。
C. 画布交互操作 (Canvas Interaction)
1. 调整布局
- 拖动文字框：鼠标按住文字框顶部的灰色标题栏，即可随意拖动。
- 拖动定位点：鼠标按住地图上的黑色实心小圆点，将其移动到地图上对应的城市位置。
- 连线跟随：无论您怎么拖，黑色的折线（Elbow Connector）都会自动计算最佳路径，保持连接。
2. 编辑内容 (所见即所得)
- 修改文字：直接点击画布上的任何文字（标题、城市名、项目类型、数字），光标会出现，直接打字修改。
- 增加行：点击文字框底部的 “+ 行”，添加一条新的项目记录。
- 删除行：鼠标悬停在某一行数据上，右侧会出现红色的 “×”，点击即可删除该行。
- 删除整组：点击文字框标题栏右上角的红色 “×”，删除整个城市的数据组。
3. 指北针与图例
- 指北针：鼠标按住指北针的 N 字母或箭头，可以拖动到画布任意角落。
- 图例：同样支持直接点击文字进行修改。
3. 常见问题 (Q&A)
Q: 上传 SVG 后画面全黑或全白怎么办？
A: 请立即点击“SVG 样式覆写”面板中的黄色按钮 “✨ 一键线框化 (Fix Black)”。这通常是因为 SVG 默认属性与浏览器背景色冲突导致的，该按钮能强制重置样式。
Q: 导出的图片里为什么没有文字框的阴影？
A: 这是特意设计的。为了符合学术出版物的严谨风格，导出时程序会自动移除文字框的 CSS 阴影，并强制加上黑色实线边框，使其看起来像正式的印刷图表。
Q: 文字框挡住地图了怎么办？
A: 按住文字框的灰色标题栏，把它拖到地图外侧空白处。黑色连线会自动延长并指向城市点。
Q: 怎么输入中文？
A: 直接点击文字区域，切换输入法输入中文即可。程序已内置支持中文字体显示。
4. 推荐使用流程
- 打开工具，点击 “🌐 找 SVG 地图”，下载需要的SVG。
- 点击 “📷 上传底图” 加载该文件。
- 如果全黑，点击 “✨ 一键线框化”。
- 勾选 “🔓 调整底图”，用鼠标滚轮缩放地图，拖拽调整位置，使其居中。
- 取消勾选 “🔓 调整底图”，锁定地图。
- 将默认的“城市/地点”标签拖到正确位置，修改文字内容。
- 点击 “➕ 添加新标注”，重复步骤，添加城市或地点。
- 检查所有连线是否清晰，文字是否正确。
- 点击 “📤 导出 PNG”，保存文件。
祝您制图顺利，论文发表成功！