GeoHey SDK 3D新特性展望

在大二的时候，课表上多了一个奇怪的课程，计算机图形学。我以为学会这个课程，我就能自己写一个魔兽世界之类的游戏，然后走上人生巅峰，开课的前几天，我还在构思游戏怎么收费可以赚钱，又不至于被喷得太惨。

而然现实很骨感，开课后我才发现，别说游戏，就连画一条直线都有三四种算法，还有各种矩阵计算，我作为数学渣，每天上课都在神游中度过。在课程结束时，我也只能用计算机画出一些西瓜和茄子之类的东西，能看出是茄子主要还是依赖于下方的文字标注。

再后来，我开始向web前端方向发展，自然而然，我会想到能不能在网页上显示绚丽的3D效果。对于js缓慢的运行速度，我实在不能相信它能够处理大型的3D场景。但是这一次现实却很给面子，WebGL技术的诞生使得在web页面上展示三维场景成为可能。

（图：WebGL游戏《寻找奥兹国》）

WebGL（Web Graphics Library）是一种前端3D绘图标准，包含HTML5规范之中，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样在网页端也能渲染出非常漂亮的3D效果了。目前主流浏览器都支持WebGL，IE需要11+。

WebGL开发需要用一种新的语言GLSL来书写着色器，这对开发者来说是一个挑战。并且与它所渲染出的绚丽画面形成非常鲜明的对比的是，WebGL提供的接口非常简单和低级，就像一个只能做加法的计算器，你需要多次按+键去实现你想要的运算。

SDK新的3D特性正是基于WebGL技术，当然，对于用户来说，具体的实现细节都是透明的，我们会保证提供的接口非常简洁易用，用户也完全不需要去学习新的东西。

作为三维生物，我们当然也更喜欢三维的画面，这也是地球人和三体人害怕“二向箔”打击的原因:-) 另外三维能够展示的信息远比二维丰富，很多数据只有在三维展示下，才能显示出它所表达的信息。

也是基于这个原因，我们开始向SDK中添加3D特性。我做了几个简单的示例页面，在lab中可以看到戳这里，建议使用chrome浏览器。接下来我简单介绍一下这几个新功能。

就像把大象装进冰箱要分三步，从2D到3D也要分三步。

step 1 让地图躺下来

地图需要和屏幕有一个夹角，才能便于进行三维展示。

这是躺下来的北京。

step 2 新的交互方式

如果只是一张放倒的地图，或许还不能直观地感受到三维的效果，要需要用户能够对地图进行拖动、缩放和旋转。特别是旋转，你们可以试试在lab的页面中用按住鼠标右键来旋转地图，有多种旋转方式哦。

step 3 新的图形

只有底图肯定是不够的，对于极海来说，地图最终还是需要为数据服务。为了更好的展示数据，我们添加了很多新的3D图形。另外，原有的2D模式下的Graphic还是可以使用哦。这个可以看下方的示例。

示例

我们选取了从北京出发的飞机航线数据，通过多种不同的方式展示出来。你可以在lab页面上看到这几个效果。

（图：用粒子效果来展示飞机航线）

（图：飞机）

最后

目前SDK的3D特性开发还处于非常早期的阶段，也就是说现在还不能使用。但是我们会保持lab的更新，通过lab的示例，也可以了解我们的开发进度。现阶段的lab页面也可能存在很多小问题，再次建议使用chrome浏览器去浏览。如果你在发现了什么问题，或者有好的建议，请通过邮箱联系我(hujl@geohey.com)。