谷歌浏览器webGL实验

今天小编推荐几个好玩的谷歌webGL实验：声音转图像，水族馆鱼群测网速，3D水母（纯代码制作），Lights音乐会等。

在详细介绍这个实验之前我先向大家介绍一下webGL技术：

WebGL是一项利用JavaScript API呈现3D电脑图形的技术，有别于过往需加装浏览器插件，通过WebGL的技术，只需要编写网页代码即可实现3D图像的展示。WebGL的规格尚在发展中，由非营利的Khronos Group管理。

如果你不知道 WebGL 是什么和能做哪些东西，先来和 Lights来一段互动体验吧，相信你会知道 WebGL 技术是多么强大。

点击这里进行互动， Lights看起来像是一段 Flash 视频，但实际上并不是，它无需插件就能在你的浏览器上顺利运行（需支持 WebGL，Chrome、Safari、Firefox 都可以），甚至可以在手机上运行。
简单地说，WebGL 是一套用于渲染 2D 和 3D 图形的标准图形库，其标准是由 Khronos、AMD、爱立信、谷歌、Mozilla、Nvidia 以及 Opera 等共同制定，目前已出现在 Mozilla Firefox、Apple Safari 及 Google Chrome 等浏览器中，同时这种高质量的 3D 表现不需借助任何插件便可通过提供硬件图形加速来达到。

在 Lights 中，黄色的"闪光线"会随着鼠标的左右点击而左右摆动，当"气泡"出现时，点击它们会出现焰火般的炫丽景象。而其背景音乐是英国歌手 Ellie Goulding 制作的一个互动音乐体验，同时随着音乐节拍界面会有呼吸状的闪光。

相信你已经对webGL技术有了一定的了解，是不是很神奇呢？

下面介绍另外几个好玩的webGL游戏：

Word Problems：声音转图像，很好玩，它会把你喜欢的音乐以图像的方式展现出来。声音播放的同时，图像不断变化，图像的任何改变都是根据声音的波动以及旋律的改变而调整得来的。如果音乐是比较high的类型，那么图像看起来会很带感哦。（将音乐拖动至浏览器即可播放）

经典鱼缸测试：这是一个经典的网页速度测试，电脑网速越快，鱼游的速度就越快，另外有多个场景可以切换，鱼的数量也可以设置。

Cycleblob：该游戏场景类似基于贪吃蛇游戏，可以通过上下左右键移动，并有多个关卡。

3D水母：该游戏有点单调，展示的是水底 3D 水母，并可以用鼠标来调整视角。

目前webGL流畅的运行还需要一些强大浏览器的支撑。chrome谷歌浏览器（下载）是最好不过的选择啦！它支持所有webGL的运行，基本没有卡顿现象。

另外为大家推荐一个非常酷的网站，chrome实验（Chrome Experiments），网站里面共有777个基于webGL和HTML5技术的网页实验和游戏。给你超棒的体验，快来试试吧！（ps：记住一点，chrome实验是要用谷歌浏览器才能打开的，记得先安装浏览器）。

谷歌浏览器webGL实验相关推荐

webgl1到webgl2_30个令人惊叹的WebGL实验！
看哪,一个具有美好前景的好工具即将出现在您的眼前. 快速,流畅. 它可以渲染3D,并通过集成进行动画处理,猜猜它是什么? HTML5 ? CSS3 ? 不,它称为WebGL,是一个软件库,可扩展Jav ...
ienumerable vs iqueryable异常
This article won't go into what these interfaces are, or the differences between them. For that, rea ...
Kali Linux安装谷歌浏览器
Kali Linux安装谷歌浏览器 Kali Linux默认安装的是火狐浏览器.但是,很多人习惯使用谷歌浏览器.在软件源中自带了谷歌浏览器的实验版.用户直接安装即可.默认,谷歌浏览器不允许root用户 ...
视觉盛宴 HTML5 3D动画应用赏析
以下是一些很棒的HTML5 3D动画应用,值得一看. 1.3D HTML5 Logo动画 HTML5多视角3D旋转动画 HTML5 3D动画实现起来非常方便,之前介绍过基于jQuery的3D旋转插件是 ...
知识普及：HTML 5到底是个什么东西
一.什么是HTML,以及HTML 5 1. HTML HTML是超文本标记语言的英文缩写,这是一种标记语言,不需要进行编译,直接由浏览器执行. 语言就必须有一个语法的规则,如果没有规则,谁知道应该把一 ...
【转载】知识普及：天煞的HTML5到底是个什么东西
HTML5开始大热标志性的事件是苹果前 CEO Steve Jobs 公开炮轰 Adobe Flash,并指出 Flash 在移动终端的不利因素,而且 HTML5 将获得胜利.顿时 IT 界.数字营销 ...
纯html5语言编写的动画,8个纯CSS3制作的动画应用及源码
本文作者html5tricks,转载请注明出处对于一个复杂的图形或者动画来说,之前我们的处理方式是图片叠加或者利用CSS+JavaScript的方法,然而随着CSS3标准的不断成熟,我们甚至完全可以 ...
五、大话HTTP协议-HTTP之URL编码、身份认证问题
在说明URL编码之前,先回顾编码和字符集的相关基础知识,再引出为什么URL中需要做编码,以及如何编码的.最后顺便介绍了下HTTP的身份认证问题.这些知识可谓是基础中的基础,重点中的重点了,不仅HTTP ...
独立产品灵感周刊 DecoHack #031 - 用 AI 给黑白照片上色哪家好？
本周刊记录有趣好玩的独立产品设计开发相关内容,每周发布,往期内容同样精彩,感兴趣的伙伴可以点击订阅我的周刊.为保证每期都能收到,建议邮件订阅.欢迎通过 Twitter 私信推荐或投稿. 产品推荐 1. ...

谷歌浏览器webGL实验

谷歌浏览器webGL实验相关推荐

最新文章

热门文章