webgl1到webgl2_9个令人振奋的WebGL演示

webgl1到webgl2

As much as developers now loathe Flash, we're still playing a bit of catch up to natively duplicate the animation capabilities that Adobe's old technology provided us.  Of course we have canvas, an awesome technology, one which I highlighted 9 mind-blowing demos.  Another technology available for intense web animation is WebGL. WebGL brings a whole new dimension to canvas animation and gaming. Here are nine jaw-dropping demos which will restore your faith in client-side vector graphic animation.

尽管开发人员现在讨厌Flash，但我们仍在追赶，以本地复制Adobe的旧技术为我们提供的动画功能。 当然，我们有canvas这项很棒的技术，我特别介绍了9种令人兴奋的演示 。 可以用于强烈的Web动画的另一种技术是WebGL。 WebGL为画布动画和游戏带来了全新的面貌。 这是九个令人叹为观止的演示，它们将恢复您对客户端矢量图形动画的信心。

1. Chrome世界迷宫 (1. Chrome World Maze)

Chrome World Maze is one of the flagship Chrome experiments.  With Chrome World Maze, you use your desktop device as the display and your mobile phone (with Chrome browser) as the controller.  The maze is any website which you'd like to roll around;  that's right, you roll around a 3D version of a website.  Outstanding!

Chrome World迷宫是Chrome的旗舰实验之一。 使用Chrome World Maze，您可以将台式机设备用作显示器，将手机(带有Chrome浏览器)用作控制器。 迷宫是您想浏览的任何网站； 没错，您可以浏览网站的3D版本。 优秀！

View Demo 观看演示

2.光学流 (2.  Optic Flow)

The Optic Flow demo uses the device camera to detect movement and splash a series of dots around the movement.  The more movement, the more animated dots.  For ultimate fun, make thrashing movements in front of your camera to get maximum reward.

Optic Flow演示使用设备相机检测运动并在运动周围溅出一系列点。 运动越多，动画点就越多。 为了获得最大的乐趣，请在相机前摇晃动作以获得最大的奖励。

View Demo 观看演示

3.滚动 (3.  Roll It)

Roll it is your classic skee ball game demo.  Much like the Chrome World Maze demo, this demo also uses the desktop screen as the display with your mobile device as the controller.  Swing your arm and mobile device (much like a wii controller), and you'll see the ball scream up the board.  Happy rolling!

Roll it是您的经典Skee Ball游戏演示。 与Chrome World Maze演示非常相似，该演示还使用桌面屏幕作为显示，以移动设备为控制器。 挥动手臂和移动设备(非常类似于Wii控制器)，您会看到球在板上尖叫。 祝滚动愉快！

View Demo 观看演示

4.方块大满贯 (4.  Cube Slam)

Ever wanted to play a 3D pong game against a lonely bear?  Cube slam gives you that chance.  Cube slam even allows you to play a friend, provided you give them a link to sync up.

是否曾经想过对一只孤独的熊玩3D乒乓球游戏？ 方块大满贯让您有机会。 只要向他们提供同步链接，多维数据集就可以让您扮演一个朋友。

View Demo 观看演示

5.铁甲MMO (5.  Ironbane MMO)

Ironbane is a 3D platform game that switches perspective as you move around a level.  The smoothness in animation is incredible and responsiveness;  Ironbane is exactly what a HTML5 game should be.

Ironbane是一款3D平台游戏，可在您平移某个关卡时切换视角。 动画的平滑度令人难以置信，ReactSwift； Ironbane正是HTML5游戏应有的风格。

View Demo 观看演示

6.珍珠男孩 (6.  Pearl Boy)

If you're ever in need of a few moments of solitude and pleasant thought, load up Pearl Boy.  This beautiful demo is simple -- direct a boy on his boat to row around a beautiful sea with a nice sunset in the background. Ahhhhh, code-powered web relaxation.

如果您需要片刻的寂静和愉快的思考，请加载Pearl Boy。 这个美丽的演示很简单-指导一个男孩乘船在美丽的大海中划船，背景是美丽的日落。 啊，由代码驱动的网络放松。

View Demo 观看演示

7.网络摄像头网格 (7.  WebCam Mesh)

The WebCam Mesh demo is incredible.  This demo utilizes the user's camera to create an animated, pulsating mesh image of the user.  You wont believe how incredibly smooth and fascinating this masterwork is.

WebCam Mesh演示是不可思议的。 该演示利用用户的相机创建用户的动画，脉动网格图像。 您不会相信这项杰作多么令人难以置信的流畅和迷人。

View Demo 观看演示

8.皮茨演示 (8.  Pitts Demo)

Pitts demo is an awesome, accelerated 3D flight game.  Like the other game demos I've shown, the physics of this game are incredible.  You can roll, slow down, accelerate, and crash!

Pitts演示是一款很棒的，加速的3D飞行游戏。 就像我展示的其他游戏演示一样，该游戏的物理效果也令人难以置信。 您可以滚动，减速，加速和崩溃！

View Demo 观看演示

9.像素化 (9.  Pixelate)

Pixelate is another camera-based demo, tracking the user's movements and displaying green pixels as object outlines.  This demo even mimics sound (try increasing and decreasing the volume, if on a Mac).

Pixelate是另一个基于相机的演示，可跟踪用户的运动并显示绿色像素作为对象轮廓。 该演示甚至模仿声音(如果在Mac上，则尝试增大和减小音量)。

View Demo 观看演示

WebGL allows for even more powerful graphic creation and animation.  A few of the items above are massively impressive games, lending promise to HTML5 gaming's future on both desktop and mobile (Firefox OS!).  I hope you enjoyed them as much as I did!

WebGL允许更强大的图形创建和动画。 上面的一些项目是令人印象深刻的游戏，这为HTML5游戏在台式机和移动设备(Firefox OS！)上的未来提供了希望。 希望您像我一样喜欢它们！

Disclaimer:  I'm not responsible for melted processors or lost work due to instant crash. 免责声明：我不对处理器崩溃或由于即时崩溃而导致的工作丢失负责。

翻译自: https://davidwalsh.name/webgl-demos

webgl1到webgl2