基于 HTML5 + WebGL 的 3D 风力发电场
前言 风能是一种开发中的洁净能源,它取之不尽、用之不竭。当然,建风力发电场首先应考虑气象条件和社会自然条件。近年来,我国海上和陆上风电发展迅猛。海水、陆地为我们的风力发电提供了很好地质保障。正是这些场地为我们的风力提供了用之不竭的能源。现在我们正在努力探索这些领域。 本文章实现了风力发电场的整体流程。能让大家能够看到一套完整风力发电预览体系。 需要注意的是,本次项目是使用 Hightopo 的 HT for Web 产品来搭建的。 预览地址: https://hightopo.com/demo/wind-power-station/ 大致流程 下面是整个项目的流程图。我们从首页可以进入到场区分布页面和集控页面。 场区分布页面又包括两个不同的 3D 场景,分别是陆地风机场和海上风机场。点击两个 3D 风机场最终都会进入到 3D 风机场景。 预览效果 首页: 1. 世界地图效果 2. 中国地 图效果 2. 城市地图效果 集控中心页面(没有动画效果): 场区分布页面 (没有动画效果) : 陆地风机场: 海上风机场: 代码实现 我们可以看到,首页的地球有三种视角状态,世界地图、中国地图、城市地图。点击每个状态相机就会转到对应的位置。在这之前我们要先预先存一下对应的 center 和 eye 。 我们最好新建一个 data.js 文件,专门用来提供数据。 相关伪代码如下: // 记录位置