# 朝圣之路

## 项目介绍

朝圣之路是一个交互式网页应用，记录了从法国Saint-Jean-Pied-de-Port到西班牙Santiago de Compostela，再到"大地尽头"Cape Finisterre的33天朝圣之旅。项目采用现代化设计，结合了Leaflet交互式地图，为用户提供沉浸式的朝圣体验回顾。

## 功能特点

- **交互式地图**：使用Leaflet.js实现的可缩放、可点击的交互式地图，显示完整的朝圣路线
- **33天完整记录**：每天一张精选照片，记录朝圣路上的点点滴滴
- **实时统计**：显示总天数、总距离、日均距离等关键数据
- **时间线展示**：垂直时间线布局，清晰展示每日行程
- **全屏查看**：点击照片可全屏查看，提供更好的浏览体验
- **响应式设计**：适配各种屏幕尺寸
- **离线可用**：除地图功能外，其他内容可离线访问

## 技术栈

- HTML5
- CSS3 (原生样式，使用渐变和Flexbox/Grid布局)
- Leaflet.js (地图功能)
- OpenStreetMap (地图数据源)
- JavaScript (原生)

## 项目结构

```
camino-pilgrimage/
├── index.html      # 主页面
├── camino-images/  # 图片资源目录
│   ├── DAY1.png    # 第1天照片
│   ├── day2.png    # 第2天照片
│   └── ...         # 共33张照片
└── README.md       # 项目说明文档
```

## 使用说明

### 查看网页

直接在浏览器中打开`index.html`文件即可查看网页效果。

### 地图功能

- 缩放地图：使用鼠标滚轮或双指缩放
- 查看详情：点击地图上的标记查看每日信息
- 查看路线：紫色线条显示完整的朝圣路线

### 时间线导航

- 点击"Back to Map"按钮返回地图位置
- 点击照片进入全屏查看模式
- 全屏模式下点击"Return to Map"返回

## 朝圣数据

- **起点**: Saint-Jean-Pied-de-Port (法国)
- **终点**: Cape Finisterre (西班牙，"大地尽头")
- **总天数**: 33天
- **总距离**: 893公里
- **日均距离**: 27公里
- **途径国家**: 法国、西班牙

## 每日主题

朝圣路上每天都有独特的主题和感悟：
- Day 1: Birthday Happy - 生日快乐
- Day 12: Moment of Fate - 命运时刻
- Day 16: Tears in the Backyard - 后院的泪水
- Day 25: Mountain Top - 山顶
- Day 33: End and Beginning - 结束与开始

## 注意事项

- 地图功能需要网络连接（使用OpenStreetMap）
- 为保证最佳体验，建议使用现代浏览器（Chrome、Firefox、Edge等）
- HTML文件和camino-images文件夹需要保持在同一目录

## 设计风格

- **配色方案**: 紫色渐变 (#667eea → #764ba2)
- **卡片设计**: 白色半透明卡片，圆角设计
- **字体**: Arial无衬线字体，简洁现代
- **动效**: 平滑滚动、渐变背景、阴影效果

## 关于朝圣之路

Camino de Santiago（圣地亚哥朝圣之路）是世界上最著名的朝圣路线之一，终点位于西班牙圣地亚哥-德孔波斯特拉，据传是使徒雅各的安息之地。无数朝圣者从中世纪开始踏上这条路线，寻找精神寄托和人生意义。

## 创作者

@SONGXUEJUN1234
