8 个效果惊人的 WebGL/JavaScript 演示

标签: IT技术 Javascript WebGL | 发表时间:2012-05-26 19:21 | 作者:齐哲
出处:http://blog.jobbole.com

WebGL 是一种 3D 绘图标准,这种绘图技术标准允许把 JavaScript 和 OpenGL ES 2.0 结合在一起,为 HTML5 Canvas 提供硬件 3D 加速渲染。WebGL 技术标准免去了开发网页专用渲染插件的麻烦,可被用于创建具有复杂 3D 结构的网站页面,甚至可以用来设计 3D 网页游戏等。

本文将为你带来 8 个效果惊人的 WebGL 效果,你可以在最新的 Chrome 浏览器中查看。

1.    Supershape.js

supershape.js 让你可以在浏览器中试验 3D superformula。Superformula 是一个通用的几何变形公式,涵盖了大量在自然界中发现的几何形状。在 supershape.js 中,除了公式参数外,你还可以选择不同的材料,并设置灯光。

8 个效果惊人的 WebGL/JavaScript 演示

2.    HolyMania

在一个扭曲的隧道中,你需要控制一个球,且不能碰到隧道的边缘。看看你的最好成绩是多少。

8 个效果惊人的 WebGL/JavaScript 演示

3.    Cube

基于 WebGL 构建,你可以在一个立方体的纽约、东京和其他城市地图上旅游。

8 个效果惊人的 WebGL/JavaScript 演示

4.    Cloth Simulation

基于 WebGL、GPU 加速的布料模拟程序。

8 个效果惊人的 WebGL/JavaScript 演示

5.    Reactive Ball

一个具有金属质感的球。这是关于光线、液态、环境地图的试验。

8 个效果惊人的 WebGL/JavaScript 演示

6.    Lorenz Attractor

这不仅是堆积随机点,而是呈现出洛伦茨吸引子(洛伦茨振子的长期行为对应的分形结构)。

8 个效果惊人的 WebGL/JavaScript 演示

7.    Swiss Addresses in 3D

使用 WebGL,以 3D 形式呈现出 370 万瑞士人口的分布图。

8 个效果惊人的 WebGL/JavaScript 演示

8.    Cell Cycle

Cell Cycle 是一个用来进行 webGL 设计的应用,用于创建可 3D 打印的细胞模型。

8 个效果惊人的 WebGL/JavaScript 演示

英文原文: 9 IMPRESSIVE WEBGL JAVASCRIPT EFFECT SHOWCASE

相关文章

相关 [效果 webgl javascript] 推荐:

8 个效果惊人的 WebGL/JavaScript 演示

- - 博客 - 伯乐在线
WebGL 是一种 3D 绘图标准,这种绘图技术标准允许把 JavaScript 和 OpenGL ES 2.0 结合在一起,为 HTML5 Canvas 提供硬件 3D 加速渲染. WebGL 技术标准免去了开发网页专用渲染插件的麻烦,可被用于创建具有复杂 3D 结构的网站页面,甚至可以用来设计 3D 网页游戏等.

Google Maps WebGL最新版嘗鮮3D建築物地圖效果

- Felix - 電腦玩物
Google地圖的Android版本在很早之前就有3D地圖效果,並且還能讓用戶以45度斜角自由旋轉,在3D建築物之間找路導航. 而現在網頁版的Google Maps也開始嘗試3D地圖模式,雖然效果離Android版本還有段距離,但也是有趣的玩法. 切換到Google地圖MapsGL版本,就可以在拉近到一定距離後,看到支援城市裡的3D建築物模型,如果切換到「衛星」檢視模式,還可以在特定世界名景前採用45度斜角、360度旋轉的檢視模式.

八大疯狂的HTML5 Canvas及WebGL动画效果

- - HTML5研究小组
HTML5、WebGL和JavaScript改变了长久以来的动画制作行业. 在过去的几年中,我们想要制作卓越的网页动画只能使用Flash和Java Applet. 而现在,使用脚本语言和渲染器在浏览器中实现疯狂的动画效果已经成为可能. 我们的电脑已经有足够的强大的能力去渲染最为复杂的动画效果. 现在浏览器和web技术的不断发展.

10个让人眼花缭乱的 HTML5 和 JavaScript 效果

- 老男人 - cnBeta.COM
感谢山边小溪-专注Web开发的投递. 作为下一代网页语言,HTML5 拥有很多让人期待已久的新特性. 如今,很多 Web 开发人员开始使用 HTML5 来制作各种丰富的 Web 应用. 本文向大家展示10个让人眼花缭乱的 HTML5 和 JavaScript 效果,让你体验下一代 Web 技术的魅力,相信你看完这些例子后会对未来的 Web 发展充满无限期待.

5 个界面效果很炫的 JavaScript UI 框架

- paul - 博客园新闻频道
  Web 开发很简单,Web 应用的 UI 开发却很复杂,如果能够利用一些成熟的 UI 框架可以大大的减少开发的复杂度. 本文向你介绍 5 款界面效果很不错的 JS 框架.   ExtJS 主要用来开发RIA富客户端的AJAX应用,主要用于创建前端用户界面,与后台技术无关的前端ajax框架. 因此,可以把ExtJS用在.Net、 Java、Php等各种开发语言开发的应用中.

10个令人惊叹的HTML5和JavaScript效果

- Hermes - 伯乐在线 -博客
  作为下一代网页语言,HTML5 拥有很多让人期待已久的新特性. 如今,很多 Web 开发人员开始使用 HTML5 来制作各种丰富的 Web 应用. 本文向大家展示10个让人眼花缭乱的 HTML5 和 JavaScript 效果,让你体验下一代 Web 技术的魅力,相信你看完这些例子后会对未来的 Web 发展充满无限期待.

使用javascript开发超棒的动画文字书写效果

- - 前端观察
在线演示  本地下载. 今天我们将介绍一个来自 script-tutorials的 javascript教程,在这个教程中,我们将介绍如何使用 javascript来生成一个动画的文字书写效果. Grant was not|||||||was very happy.

He took the letter to a shop in London where they bought and sold old papers.

Web 开发必备——使用 amMap 轻松添加互动效果的 JavaScript 地图

- - 博客园_梦想天空
  amMap 是一个工具,你可以​​轻松地使用它在您的网页和基于. JavaScript 的应用程序中添加互动地图功能.   您可以使用此工具来显示您的办公室的位置,你的旅行路线,创建您的经销商地图,照片或插图,可作为图层和背景的地图,这样就可以实现各种界面效果,电子学习工具等等. 12款很棒的浏览器兼容性测试工具推荐.

WebGL存在严重的安全漏洞

- CandyFrankie - Solidot
Panggit 写道 "HTML5中的WebGL技术已在Firefox和Chrome等浏览器中实现,并被默认开启,但这实际上给浏览器带来了极大的安全隐患. 问题根源在于,大多显卡以及显卡驱动在设计时并不考虑安全问题,而将相关安全问题交由操作系统完成. 但浏览器沙盒跳过了这一环节默认WebGL可以被安全执行,这会使脚本取得跨域名的执行权限,甚至取得访问本地文件的权限.

WebGL版的CryEngine即将到来?

- Dexter.Yy - HiWebGLHiWebGL
不如Source和CryEngine采用WebGL,UE支持Flash,形成 (Valve + Crytek + Mozilla + Google + Apple) vs (Epic + Adobe + Microsoft) 的战争格局罢. 我便是那唯恐天下不乱的开发者~XD. 上周早些时候,Epic Games在Adobe Max大会上演示了支持Flash 11技术的虚幻3引擎,凭借优秀的画面效果和流畅的性能表现,博得了一片赞誉.