天大出片地图
天津大学有两个校区：卫津路校区（老校区，南开区）和北洋园校区（新校区，津南区）。
两大校区各有特色——老校区以历史建筑+海棠古韵著称，新校区以现代建筑+大规模海棠花海闻名。
触发条件
当用户提及以下话题时使用本 Skill：
- "天大拍照" / "天大海棠" / "天大银杏" / "天大打卡" / "天大毕业照"
- "天津大学出片" / "北洋大学拍照"
- 咨询校园拍照穿搭、光线技巧、姿势指导
- 想查看或新增打卡点
- 想为某个打卡点添加实拍照片
使用方式
查看出片地图
当用户想看天大出片地图时，加载并展示 assets/map.html 交互式地图。
该地图包含：
- 卫津路校区 7 个打卡点 + 北洋园校区 6 个打卡点
- 每个打卡点有详细的位置、最佳季节、穿搭、光线、姿势建议
- 可切换校区视图
- 支持标记"已打卡"状态（存储在浏览器 localStorage）
- 支持用户直接上传实拍照片到打卡点（浏览器 localStorage，自动压缩，可删除）
向用户说明交互式地图的功能：点击点位查看详情、切换校区、标记已打卡、上传照片。
查看/查询打卡点信息
当用户询问某个具体打卡点（如"九教怎么拍"、"铭德道什么时候最美"等）时，
从 references/spots.md 中查找对应点位信息，以结构化卡片形式呈现给用户，包含：
- 最佳季节和时间
- 穿搭建议
- 光线技巧
- 姿势攻略
- 出片指数
添加新的打卡点
当用户想添加新的打卡点时，必须同时修改 4 个地方，缺一不可——否则新点位不会出现在地图上：
-
在
references/spots.md中添加新点位
照着已有条目的格式，补上坐标、最佳季节、穿搭、光线、姿势等字段。 -
在
assets/map.html的spots数组中添加新点位
该数组在文件第 760 行附近（搜索const spots = [）。
照着已有对象的字段结构添加一个新对象，必填字段：id、campus、name、icon、bannerBg、rating、season、time、outfit、light、tags、poses、tip、photos。
注意：id必须是当前最大 id + 1，且不要与已有 id 重复。
bannerBg是一个 CSS 渐变字符串，用于详情卡片的氛围 banner。按场景类型选择：海棠花用粉色系渐变、建筑用暖色/冷色渐变、湖景用蓝绿色渐变、广场用金色渐变。可参照现有点位的写法。icon用一个 emoji 表示打卡点主题。 -
在对应校区的 SVG 地图里添加红点标记
卫津路校区的 SVG 在<svg id="svg-weijin">中，北洋园校区的在<svg id="svg-beiyang">中。
照着已有标记的写法，在对应校区 SVG 的末尾补一个<g class="spot-marker">组：
html <g class="spot-marker" data-spot="新ID" onclick="showDetail(新ID)"> <circle cx="X" cy="Y" r="10" fill="var(--tju-red)" class="marker-bg" id="marker-bg-新ID"/> <text x="X" y="Y+4" text-anchor="middle" fill="white" font-size="10" font-weight="700">序号</text> </g>
坐标 cx/cy 选一个与现有点位不重叠的位置即可。 -
在地图下方的快捷小标签栏里添加入口
卫津路校区的标签在 svg-weijin 对应的容器底部（搜索showDetail(0)找到标签区域），
北洋园校区同理（搜索showDetail(7)）。
照着已有标签格式添加一条：
html <span style="font-size:12px;padding:3px 8px;background:#FEF3F5;border-radius:10px;color:var(--tju-red);cursor:pointer" onclick="showDetail(新ID)">序号 名称</span>
完成以上 4 步后告知用户新打卡点已添加。
添加实拍照片
照片上传有 两种方式，根据用户需求选择：
方式一：用户自己在地图里上传（推荐）
地图已内置浏览器端照片上传功能，用户可以直接操作：
- 打开地图，点击任意打卡点
- 在详情卡片底部点击「📷 上传照片」或「📷 添加照片」按钮
- 从本地选择图片文件，系统自动压缩（最大 600px 宽，JPEG 75% 质量）并保存到浏览器 localStorage
- 照片立刻显示在详情卡片的照片墙中，每张照片右上角有 ✕ 可删除
- 每个打卡点最多 20 张照片
特点：照片保存在用户浏览器本地（localStorage），仅在该设备/浏览器可见，不会分享给其他人。
适用场景：用户自己打卡留念、随时查看自己拍的照片。
方式二：AI 帮用户把照片加到地图源文件（分享给所有人）
当用户想把照片分享给所有使用这个 Skill 的人看时：
- 确认打卡点名称和对应的 spots 数组中的 id
- 如果
assets/photos/文件夹不存在，先新建一个（该文件夹在打包时可能未包含） - 将照片文件保存到
assets/photos/目录，命名规则：weijin-九教-1.jpg或beiyang-海棠堤-1.jpg - 在
assets/map.html的spots数组中，找到对应点位的对象，将照片路径添加到photos数组中：
javascript photos: ['photos/weijin-九教-1.jpg']
注意：路径写photos/xxx.jpg，不要写assets/photos/xxx.jpg。
因为 map.html 本身就在assets/文件夹内，浏览器会以 map.html 所在目录为基准查找相对路径，
如果写assets/photos/...会变成assets/assets/photos/...导致找不到照片。 - 告知用户照片已加入该打卡点
特点：照片打包进 Skill，所有使用该 Skill 的用户都能看到。
适用场景：精选示范照片、官方攻略配图。
穿搭/光线/姿势通用咨询
当用户询问通用拍照技巧时，参考 references/spots.md 末尾的「通用拍照攻略」部分，
给出季节穿搭色系表、光线黄金法则、姿势百搭公式。
注意事项
- 海棠季（3月底-4月）和银杏季（11月）是人流高峰期，提醒用户合理安排时间
- 卫津路校区海棠季需要预约，提醒用户关注"天津大学"公众号
- 数据存储在
references/spots.md和assets/map.html中，修改两者时保持同步 - 新增打卡点必须同时修改 4 处（spots.md、spots 数组、SVG 红点标记、快捷标签），缺一不可
- 照片路径用
photos/xxx.jpg（相对 map.html 所在目录），不要加assets/前缀 - 用户上传的照片保存在浏览器 localStorage（上限约 5MB），图片已自动压缩（600px 宽 JPEG 75%），每个打卡点最多 20 张；清除浏览器数据会丢失用户照片
