自驾旅行行程及路书规划
把用户手上的「基础行程单 / 会议纪要 / 旅行想法」,沉淀为一份可执行、可交互、可共享的自驾路书:逐日行程、真实地理地图、多人勾选清单、AA 费用账单、出行清单,并发布为公网链接。
触发条件
用户表达以下任一需求时调用本技能:
| 意图 | 典型说法 |
|---|---|
| 规划自驾游 | 帮我做一份自驾攻略 / 路书 / 行程计划 |
| 整理已有计划 | 基于这个 PDF / 会议纪要 / 聊天记录细化行程 |
| 交互式页面 | 做成可交互的网页 / 带地图的行程 / 多人一起编辑 |
| 多人协作 | 6 人小队的行程 / 共同勾选 / 费用AA / 账单 |
| 旅行清单 | 出行 checklist / 签证证件准备 |
核心交付物(六件套)
- 逐日路书 —— 每天:车程信息条(距离/时长/加油点)+ 时间轴 + 住宿/美食/预算建议 + 贴士/警示
- 交互式行程地图 —— 基于真实经纬度的可筛选地图(Leaflet + Esri 底图),点位分「起点/终点/住宿/景点/自然奇观」配色,按天高亮当日路线
- 每日行车路线小地图 —— 每张日程卡内嵌当日行车路线与途经点
- 玩乐选项清单 —— 分类列项(表演/射击/夜景/美食/购物/周边),每位成员独立勾选,自动统计共同交集
- 行程费用 & AA 账单 —— 分类记账、支付人、分摊范围(全员/指定成员)、自动汇总净额并生成结算建议
- 出行清单 —— 按「证件签证/现金/通讯/预订/衣物/安全」分类的勾选清单,带进度条
工作流程
Step 1 · 理解输入
- 读取用户提供的基础行程(PDF、文档、会议纪要、聊天记录)
- 提取关键信息:天数与日期、城市顺序、住宿点、必玩景点、航班/时区、人数
- 单独列出「用户共识要点」(团队已明确拍板的决定,路书必须遵守)
- 若有冲突(如纪要改了原方案),以最新共识为准并在页面注明
Step 2 · 核实关键事实(全部以权威来源为准,页面标注核实日期)
- 证件入境:签证类型、EVUS/ETA 等电子登记要求、驾照翻译/认证件规则(中国驾照注意:未加入《维也纳道路交通公约》,需「原件 + 认证件/公证翻译件」,国内办的 IDP 无效)
- 预约政策:热门景点是否需提前预约(例:羚羊谷必须订纳瓦霍导览团;马蹄湾仅收停车费;优胜美地 2026 年起取消预约制);国家公园门票/年票是否通用
- 车程数据:各路段距离与时长(含中途补给/加油点、最长车程段提醒)
- 时区与航班:确认起降时刻(含跨日期变更线情况)、各城市时区是否统一
Step 3 · 设计逐日路书
- 确定统一出发节奏(如每日 09:00 从酒店出发),每天时间轴据此顺延
- 每天含:
车程信息条(图标化距离/时长/加油/住宿地)+时间轴(时段+内容+补充说明)+贴士/警示+住宿建议+美食参考 - 长车程日(如 >600km)单独标注「驾驶疲劳/高温/无信号」警示
- 住宿/美食/预算做成可编辑单元格(供用户后续替换最终方案)
Step 4 · 制作交互式 HTML(单文件自包含,无构建步骤)
- 设计底线:统一色板(CSS 变量)、内联 SVG 图标库(禁 emoji 当图标)、克制的动效(单一主角动效 + prefers-reduced-motion)、定制浏览器表面(选区/滚动条/焦点环)
- 功能模块:交互地图(Leaflet)、勾选清单(localStorage)、费用 AA、编辑模式、打印样式
- 移动端适配:导航横向滚动、表格折行、地图高度自适应
- 多端验收:桌面 + 移动截图、console 0 报错
Step 5 · 发布与共享
- 静态单页 → 直接发布公网链接
- 需成员共享 → 升级为 Node.js + Express + JSON 文件存储(GET/POST
/api/sync,白名单 key,防抖推送 + 轮询拉取 + 断线自动重连) - 缓存处理:响应头
no-store+ 页面 meta,避免成员拿到旧版页面 - 交付时附使用说明:强制刷新一次、同步状态指示器含义
技术选型速查
| 场景 | 推荐 |
|---|---|
| 境外路线地图(美西/欧洲等) | Leaflet + Esri WorldStreetMap(街道数据全、英文标注) |
| 中国境内地图 | 腾讯地图 JSAPI(符合测绘合规) |
| 图标 | 内联 SVG <symbol>,统一 stroke-width 1.7 |
| 本地存储 | localStorage |
| 成员共享 | Node.js + Express + JSON 文件(沙箱内可部署) |
| 公网部署 | 发布为应用(静态 / Node 两种模式) |
质量底线(对照验收)
- [ ] 关键事实来自权威来源,页面标注「已核对年份」
- [ ] 用户共识要点全部体现在路书中
- [ ] 每日时间轴节奏统一、车程数据自洽
- [ ] 页面 0 console 报错、0 布局缺陷
- [ ] 桌面 + 移动端截图验收通过
- [ ] 交互功能实测(勾选、计算、编辑、筛选)
- [ ] 文案具体可执行,无空泛套话
- [ ] 发布链接可访问,成员共享数据双向同步验证通过
参考文件
reference/itinerary-design.md—— 逐日路书内容设计规范(时间轴/车程/餐饮住宿/清单)reference/html-roadbook.md—— 交互式 HTML 路书技术规范(结构/样式/地图/费用AA/云同步)reference/deploy-share.md—— 部署与成员共享方案(静态 / Node + API / 缓存处理)examples/roadbook-example.html—— 完整成品参考实现(美西环线 9 日实例)