这是一个静态HTML项目,使用Leaflet.js地图库展示个人旅行足迹。项目包含一个互动地图,标记了作者访问过的各个城市,并附有相应的旅行回忆和评论。
my_travel/
├── app.html # 主页面文件
├── penguin.png # 地图标记图标
├── places.json # 地点数据文件
├── nginx-travel.conf # Nginx配置文件
└── README.md # 项目说明文件
places.json
文件格式:
[
{
"name": "城市名称",
"lat": 纬度,
"lon": 经度,
"comment": "旅行回忆和评论"
}
]
编辑 places.json
文件,添加新的地点对象即可。
可以修改页面中的CSS样式来调整外观。
替换 penguin.png
文件可以更换地图标记图标,建议使用32x32像素的PNG图片。
点击地图上的企鹅图标可以查看每个地点的详细旅行回忆。地图支持缩放和拖拽操作,您可以自由探索所有标记的地点。