新手入门

本篇用一张「杭州西湖一日游路线图」，带你走完唯杰地图智能体平台的基本流程：认识首页，用一句话做一张地图，边看边改，最后下载并打开成品。照着做一遍，几分钟就能得到一个可以直接打开的网页地图。学会以后，换成你自己的地点、数据或图纸，用同样的方法就能做出别的地图。

认识首页

在浏览器打开 https://vjmap.com/agent/ ，用唯杰地图账号登录（账号与官网、地图动画等应用通用）。登录后进入首页：

1. 左侧导航：依次是「首页」「会话」「技能」「案例」「应用」。做过的对话都保存在「会话」里；左下角还有「反馈」「设置」和退出登录按钮。
2. MCP：「MCP 连接 AI 编辑器」，可以把平台接进你自己的 AI 编辑器，详见接进 AI 编辑器。
3. 输入框：用一句话说需求。输入框里的灰色提示就是例子，比如把北京到西安的自驾路线做成地图动画，选一张 DWG 后让它提取图中所有表格。
4. 文件 · 图片 · 图纸 · 技能：给需求带上附件或指定技能，见下表。
5. 开始对话：把需求发出去，进入对话页。
6. 案例：现成的模板。点模板会把提示词填进输入框，改一改就能开始；带「示范」的模板可以先看一遍完整的对话，详见案例与社区作品。
7. 应用：页面往下滚动，可以看到平台自带的专业应用，点开就能用，详见技能与应用。

输入框下方四个按钮的用途：

一句话做一张地图

说出需求

1. 在首页的输入框里输入：「做一张杭州西湖一日游路线图：断桥残雪、白堤、孤山、苏堤春晓、雷峰塔，按游览顺序连线，点站点弹出简介」。
2. 这个需求不需要附件，直接点「开始对话」。

1. 需求：一句话写清楚做什么图、有哪些地点、怎么连线、点了以后显示什么。
2. 文件：本例不用。
3. 图片：本例不用。
4. 图纸：本例不用；看 CAD 图纸时，从这里选图，详见看懂 CAD 图纸。
5. 技能：本例不用，智能体会自己挑选合适的技能。
6. 开始对话：发出需求。

看智能体怎么做

点「开始对话」后，页面切换到对话页，这次对话会自动出现在左侧的会话列表里。智能体先查地名坐标，再写页面，然后自己检查，每一步都依次列在对话里：

1. 你的需求：显示在最上方，带发送时间。
2. 思考：虚线框里是智能体的思考过程，「思考中…」后面是它当时在想的内容，点右侧箭头可以展开。
3. 加载技能：带「技能」标签的一步，表示智能体加载了某个专业技能。本例加载了 vjmap-common 和 tianditu-geocoder，后者用来查地名坐标。
4. 执行步骤：运行命令、读写文件等。右侧是这一步的耗时，绿色对勾表示已完成。
5. 还没完成的步骤：右侧显示时钟图标，表示这一步还在等待执行。

生成过程中，输入框右侧的「发送」会变成「停止」，需要时可以随时中止，详见对话与预览。

预览成品

做好以后，智能体在回答里列出产物和说明，右侧的「预览」直接打开做好的网页：五个景点按游览顺序连成了路线。

1. 会话：这次对话出现在左侧会话列表里，随时可以回来接着做。
2. 回答：产物与说明：列出生成了哪些文件（index.html 网页、站点和路线数据、页面截图），页面里有什么内容，以及数据来源与限制。
3. 成果文件：预览上方显示正在预览的文件，「成果」表示这是本次的最终成果。
4. 预览：直接显示做好的网页，可以拖动、缩放和点击，和在浏览器里打开的效果一样。
5. 新窗口打开：在浏览器的新标签页里单独打开这个页面。

在预览里点一个景点，会弹出它的简介：

1. 点站点：地图上带编号的圆点就是景点，编号即游览顺序。
2. 弹出简介：本例显示顺序、景点名、建议时间、建议停留、简介和游览提示。
3. 矢量 · 影像 · 全图 · 主题：页面右上角的按钮，用来切换矢量或影像底图、回到全图、切换深浅主题。

边看边改

接着说

对结果不满意，不用重新开始，在下方输入框里接着说就行。例如：

1. 输入「路线改成红色虚线，再加上三潭印月这一站」。
2. 按 Enter 或点「发送」。（需要换行时按 Shift+Enter。）

1. 接着说：直接说要改哪里，不用重复之前的需求。
2. 发送：发出修改要求。

智能体会在原来的基础上修改，改完后右侧的预览会自动刷新。本例中它改了站点数据、路线数据和页面配置，重新检查并截图，然后在回答里说明改了什么：路线改为红色虚线；新增第 5 站三潭印月，雷峰塔顺延为第 6 站；站点简介、建议时间和统计同步更新。

1. 红色虚线：路线从橙色虚线改成了红色虚线。
2. 说明更新：页面说明改成「共 6 个站点」，并注明苏堤春晓到三潭印月一段为湖上船行。
3. 统计更新：站点数 6 个，示意里程 3.9 km，建议时长 7.5 小时。

看手机上的效果

做好的页面在手机上是什么样？在预览上方切到手机尺寸看一看：

1. 桌面 · 平板 · 手机：三个按钮按不同屏幕宽度显示预览，点最右边的「手机」。
2. 手机宽度下的效果：预览变窄，标题和右上角的按钮也跟着变窄排列。觉得小屏上哪里不好看，可以接着说，让智能体调整。

下载和打开成品

生成的网页和数据都保存在这次会话里：

1. 点右侧的「文件」页签，查看全部文件。
2. 点「下载全部」，把所有文件打包下载到本地。
3. 想单独打开页面，回到「预览」页签，点上方的「新窗口打开」。

1. 文件：页签上的数字是文件个数，本例共 9 个。
2. 下载全部：一次性打包下载会话里的所有文件。
3. 入口：标有「入口」的 index.html 就是预览里打开的页面。其余是数据（data 文件夹里的页面配置、路线和站点）、运行文件（js 文件夹）和截图（out 文件夹里的 preview.png）。

本例中智能体在回答里说明了 index.html 可以直接双击打开，所以下载后在本地也能使用。

下一步

想了解对话工作台的更多细节，比如右侧各个页签、停止生成和重新编辑提问，请看对话与预览；想让智能体看 CAD 图纸，请看看懂 CAD 图纸；不知道怎么提需求，可以从案例与社区作品开始。全部篇目见文档首页。