天宫空间站虚拟漫游体验

项目概述

本项目是一个基于Web的天宫空间站360°虚拟漫游体验，旨在让用户通过交互式界面，身临其境地参观中国天宫空间站的各个部分，包括天和核心舱、问天实验舱、梦天实验舱、神舟飞船和天舟货运飞船。用户可以查看全景图、了解各舱段的功能和特点，以及参与知识问答测验。

主要功能

• 空间站概览：显示天宫空间站的整体结构，并可点击不同舱段进入详细探索
• 舱段详情：浏览每个舱段的全景图和详细信息
• 交互式热点：点击场景中的热点标记获取特定区域的详细介绍
• 虚拟导览：在各个舱段之间自由切换，了解不同部分的功能
• 知识问答：测试用户对天宫空间站知识的掌握程度

文件结构

• begin.html：项目入口页面，包含欢迎界面和开始探索按钮
• test.html：空间站概览页面，显示各舱段的位置和简介
• tianhe.html：天和核心舱详情页面
• wentian.html：问天实验舱详情页面
• mengtian.html：梦天实验舱详情页面
• shenzhou.html：神舟飞船详情页面
• tianzhou.html：天舟货运飞船详情页面
• quiz.html：知识问答页面
• css/style.css：样式表文件
• js/data.js：包含舱段、全景图和热点信息的数据文件
• js/main.js：主要功能实现的JavaScript文件
• images/：存放全景图、界面元素和背景图片的文件夹

使用方法

1. 打开 begin.html 进入欢迎页面
2. 点击"开始探索"按钮直接进入空间站概览页面
3. 在概览页面点击不同舱段进入详细探索
4. 使用界面上的导航按钮在全景图之间切换
5. 点击"+"热点图标查看详细信息
6. 点击右上角的"知识问答"按钮参与测验
7. 使用右上角的模块选择器在不同舱段之间切换

技术特点

• 纯HTML、CSS和JavaScript实现，无需第三方库
• 响应式设计，适配不同尺寸的屏幕
• 交互式热点标记系统
• 模块化的数据结构，便于维护和扩展
• 全景图导航系统，支持键盘和鼠标控制
• 沉浸式的用户界面设计

浏览器兼容性

本项目支持现代浏览器，包括但不限于：

• Google Chrome（推荐）
• Mozilla Firefox
• Microsoft Edge
• Safari

开发者信息

该项目使用纯前端技术开发，主要包括：

• HTML5 提供页面结构
• CSS3 提供视觉设计和动画效果
• JavaScript 提供交互功能和数据处理

项目采用模块化设计，data.js 存储所有内容数据，main.js 负责功能实现，便于后续扩展和维护。

扩展建议

项目可以进一步扩展的方向：

• 添加舱段3D模型
• 增加天宫空间站的建造和发展历程介绍
• 增加学习资料与外部链接