中文版CHN

太平洋洋流可视化项目运行指南

一、环境准备

1. 安装Visual Studio Code（已安装可跳过）
   • 访问Visual Studio Code官方网站，下载并安装VS Code。
2. 安装Live Server插件（已安装可跳过）
   • 打开VS Code，点击左侧扩展图标（或按Ctrl+Shift+X），在搜索框中输入“Live Server”，找到后点击安装。

二、项目准备

1. 获取项目文件
   • 确保你已获得完整的Ocean-Visual项目文件夹，其中应包含Ocean-Visual.html（主页面文件）和libs文件夹（包含所有依赖库）。
2. 打开项目
   • 启动VS Code，选择“文件”>“打开文件夹”，浏览并选择Ocean-Visual项目文件夹。

三、运行项目

1. 使用Live Server启动项目
   • 在VS Code左侧资源管理器中找到并点击Ocean-Visual.html文件，右键点击该文件，选择“Open with Live Server”（使用Live Server打开），或者点击VS Code右下角状态栏中的“Go Live”按钮。
2. 查看项目
   • Live Server将自动在默认浏览器中打开项目，你将看到一个三维地球和洋流可视化效果。可以通过鼠标进行以下操作：
     • 左键拖动：平移视角
     • 滚轮拖动：旋转视角
     • 滚轮滚动：缩放视角。

面向群体：本指南适用于开发者、研究人员以及对海洋科学和数据可视化感兴趣的个人。通过VS Code和Live Server，你可以在本地环境中快速运行和测试此项目，无需额外的服务器配置。

ENG英文版

Pacific Ocean Current Visualization Project Guide

I. Environment Preparation

1. Install Visual Studio Code (Skip if already installed)
   • Download and install VS Code from the official website.
2. Install Live Server Plugin (Skip if already installed)
   • Open VS Code, click the Extensions icon on the left sidebar (or press Ctrl+Shift+X), search for “Live Server” in the search box, and click “Install”.

II. Project Preparation

1. Get the Project Files
   • Ensure you have the complete Ocean-Visual project folder, which should include the Ocean-Visual.html (main page file) and the libs folder (containing all dependencies).
2. Open the Project
   • Launch VS Code, select “File” > “Open Folder,” and browse to select the Ocean-Visual project folder.

III. Running the Project

1. Launch the Project with Live Server
   • In the VS Code Explorer, find and click the Ocean-Visual.html file, right-click it, and select “Open with Live Server” or click the “Go Live” button in the VS Code status bar at the bottom right.
2. View the Project
   • Live Server will automatically open the project in your default browser. You should see a 3D globe with ocean current visualizations. You can interact with it using your mouse:
     • Left-click and drag: Pan the view
     • Scroll with the mouse wheel: Rotate the view
     • Zoom in/out with the mouse wheel: Adjust the zoom level.

Target Audience: This guide is intended for developers, researchers, and individuals interested in ocean science and data visualization. With VS Code and Live Server, you can quickly run and test this project in a local environment without additional server setup.