HTML5+WebGL：构建3D网页新世界

 今年下半年， HTML5 和 WebGL 变成极热门词语，3D 网页来势汹汹。主流的浏览器 Google Chrome 以及 Mozilla Firefox 均致力于 HTML5+WebGL 的 3D 网页技术方案的发展，各种实验性项目层出不穷。这是一个转折时期——互联网最重要的门户浏览器正在从主流支持 2D 平面网页内容到原生的支持 3D 物体形象的展示。

何谓WebGL ?

WebGL 是网页开发语言 JAVA Script 形式的绘图 API 接口，提供设备硬件图形能力的直接调用。HTML5 则是网页开发语言新标准，提供了网页上的 Canvas “画布”供网页上的 3D 对象展现。

简单的说，在此之前，3D 物体形象在网页上不能直接展示，必须使用非标准的特殊网页语言语法或者通过安装额外的浏览器插件。HTML5 和 WebGL 提供了一种技术方案，使程序员可以直接在网页上展示物体的 3D 形象，并且这种展现直接使用设备的图形处理器的处理能力,其绘图性能能够得到保证。3D 网页技术应用很广，体验 3D 网页也非常简单，我们只需要桌面电脑支持现代的图形显示设备，同时，必须安装足够高版本的新型浏览器，诸如 firefox 和 Chrome 即可。

3D网页游戏

先说说 3D 网页游戏，在这场技术浪潮中，先知先觉的游戏厂商真正积极研发 WebGL 游戏引擎，为 3D 网页游戏潮流的到来提前进行技术储备。

Mozilla 社区的 Paladin 项目组正在开发名为“Gladius”WebGL 3D 游戏引擎，CopperLicht 则是一个快速 JAVAScript 的 WebGL 游戏引擎，在其网站上提供了一批 WebGL 游戏场景范例，其中不少的 3D 场景甚至可以媲美传统的 PC 桌面游戏。它们的效果可以在 ResureFox和ambiera网站看到。

3D地图

而 3D 地图是另外一个关键应用。和目前的枯燥平面地图相比，3D 地图可以以旋转的视角查看街景、建筑物的立体形状，用户有身临其境的感觉，体验非华丽、无以形容。在 MapsGL 项目中，3D 地图的先行者 Google 正利用 WebGL 技术提供 3D 街景地图。按照 Google 的说法，他们在“重新打造了 Google 地图……提供更强大的性能、更丰富的 3D 图形、更流畅的图像过渡效果和 45° 视图旋转效果，以及能更方便地访问街景视图。”

要查看其效果，你可以直接访问 Google Maps 网页，并选择打开 MapsGL 功能。当地图的比例放大到一个街道路口大小的时候，平面的地图就会展示成 3D 的街景。下面是使用 MapsGL 功能访问美国曼哈顿周围的地图看到景观截图，转动图上的罗盘或者移动鼠标，查看的视角随之转动，其效果仿佛本人在曼哈顿的街道上闲逛。

可以想象，当每个城市都完成了 3D 的建模，并通过网页提供服务，3D 地图之上能够叠加各种有趣的服务，例如：3D 寻路导航，虚拟旅游，美食查找、网络社交、网络游戏等等。这些应用有目前的 2D 的版本，安装插件可以实现不怎么流畅的 3D 效果，但在未来的 3D 网页中，逼真的 3D 城市街景呈现了流畅的视角转换后，它将带来迥异的用户体验。

88 0 标签：新世界3D构建网页HTML5WebGL

获取行业资讯，分享行业开服信息和产业动态，敬请关注40407官方微信和40407官方微博。