适用于 Firefox 的 WebGL

这是一篇从 Vlad Vukićević 的个人博客转载的文章。WebGL 致力于将基于 GL 的 3D 扩展引入 Web,目前正通过 Khronos 组织进行标准化。WebGL 的工作基于 Vlad 创建的 GL Canvas 扩展,现在 Firefox 和 Safari 都在实现它。包含 WebGL 支持的版本 现在每晚都会构建。这项工作不会包含在 Firefox 3.6 中,但可能会包含在 3.6 之后的版本中。要跟踪 WebGL 的进展,您可以关注 VladMark Steele 的进展。

自从 我周五发的文章 以来,我们进行了一些修复,以改进我们的 WebGL 实现并修复了我们在周五发现的一些错误。我很期待看到人们如何使用 WebGL,以及它现在如何在 Web 上发挥作用。例如,EA/Maxis 最近在其热门游戏 孢子 中添加了生物设计的 COLLADA 导出功能,并且他们有一个 孢子百科,玩家可以在其中查看其他人的创作。目前,这些预览只是图像。使用 WebGL,它们可以是完全 3D 的,甚至是动画的。

孢子生物视图(缩略图)周末我整理了 这个例子,它使用 WebGL 渲染导出的孢子生物,并让用户旋转 3D 模型以从不同角度查看它。对于那些想尝试它的人,您需要最新的 Firefox nightly 版本(从今天,9 月 21 日或更新的版本),并且需要按照 这篇文章 中的描述翻转一个首选项。

我将努力更新我移植到 Canvas 3D 的 GL ES 2 书籍中非常基本的“入门”演示,以便那些有兴趣进行实验的人可以有一些好的基本代码可以参考。它们还没有更新,但应该在一两天内更新。

对于那些没有最新 OpenGL 驱动程序或无法获得最新 OpenGL 驱动程序(例如,许多常见的 Intel 显卡没有 OpenGL 驱动程序)的 Windows 用户,您可以通过下载 Mesa 软件 OpenGL 实现的 Windows 版本启用软件渲染。它不会很快,但应该足以让您了解发生了什么,并试用一些演示。要使用它,请下载 webgl-mesa-751.zip 并将其解压缩到计算机上的某个位置。它有一个文件 OSMESA32.DLL,您需要告诉 Firefox 在哪里可以找到它:打开 about:config,并将首选项 *webgl.osmesalib* 设置为 OSMESA32.DLL 的路径。如果您将其解压缩到“C:temp”,则应在首选项中输入“C:temposmesa32.dll”。然后,将 *webgl.software_rendering* 翻转为 true,您就可以开始了。

(Mac OS X 用户不需要理会软件渲染,因为 Apple 已经提供了高质量的 OpenGL 实现,Linux 用户只要安装了最新的 OpenGL 驱动程序即可。)


35 条评论

  1. Aaron

    这太棒了。Vlad 干得好。我迫不及待地想看看未来几个月利用浏览器中 OpenGL 的素材。

    2009 年 9 月 21 日 18:29

  2. Eric Shepherd

    需要注意的是,这是主干 nightly 版本,而不是 Namoroka nightly 版本。

    2009 年 9 月 21 日 18:56

  3. Yann

    我似乎无法在 Linux amd64 上运行它,什么都没有加载……有什么想法吗?

    2009 年 9 月 22 日 09:02

  4. András Bártházi

    我的版本是“Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.3a1pre) Gecko/20090922 Minefield/3.7a1pre”,我看到一个空框。我已经在 about:config 中启用了扩展,并且我已经尝试了启用和禁用软件渲染。

    2009 年 9 月 22 日 11:53

  5. […] – Firefox 中的 WebGl (Ars Technica) – 适用于 Firefox 的 WebGL ([…] 的博客)

    2009 年 9 月 22 日 12:41

  6. Steve Harvey

    很棒……但我们在 15 年前就可以用 VRML 做到这一切。

    2009 年 9 月 22 日 14:38

  7. […] Mozilla Hacks 网站上的后续文章中,他展示了如何使用 WebGL 显示 COLLADA 模型。[…]

    2009 年 9 月 22 日 18:41

  8. […] – Firefox 中的 WebGl (Ars Technica) – 适用于 Firefox 的 WebGL ([…] 的博客)

    2009 年 9 月 23 日 00:07

  9. […] 此处的信息。在 Twitter、Delicious、Dzone、Reddit、Stumble 上关注我 […]

    2009 年 9 月 23 日 10:28

  10. David Leppik

    @Steve Harvey:你说得对,但这比 VRML 的潜力更大。VRML 描述的是 3D 场景,而不是用于渲染帧的 API。理论上它们是可以互换的,但从来没有基于模型的 API 流行起来,部分原因是某些事情很难或不可能做到,例如分屏视图或使用不同的光照渲染场景中的不同对象。VRML 从未流行起来,部分原因是它是一个单独的插件,部分原因是少数需要使用它的网站可以轻松地提供一个 Windows 应用程序,该应用程序可以服务几乎同样多的用户。

    如今,非 Windows 用户越来越多,人们更习惯于使用网页而不是安装程序,JavaScript 也日趋成熟,我认为它的用途也更加广泛。主要是游戏,但也包括地图(例如谷歌地球)和数据可视化。

    2009年9月24日 08:47

  11. Gil

    孢子示例对我不起作用。我使用的是 Ubuntu 9.04,我收到一个对话框消息,告诉我打开 webgl……但它已经打开了!

    2009年9月25日 10:58

  12. Floyd

    在 Ubuntu 9.04 上也无法使其工作。尝试将 webgl.osmesalib 设置为 /usr/lib/libGL.so,但 getContext 仍然失败。

    2009年9月26日 08:29

  13. […] Mozilla 的 Source Evangelist。暴雪导出了一个孢子生物,并使用 WebGL 的 API 将其渲染为一个可以旋转的 3D 模型,您可以从不同的 […]

    2009年9月29日 04:05

  14. […] 我刚开始将 C3DL 库从使用 Canvas 3D 移植到 WebGL 时,遇到了 instanceof 的问题。在特定代码行中,我检查对象是否为 […]

    2009年10月18日 10:00

  15. […] 事件、移动技术 | 标签:ARM techcon、Jay Sullivan、Mozilla | 发表评论  Mozilla 的移动副总裁 Jay Sullivan 在他的 […] 演讲中将公司定位于移动网络的前沿。

    2009年10月22日 14:35

  16. […] 网络开发者可以为任何支持该标准的浏览器创建交互式 3D 内容。到目前为止,Mozilla、Safari 和可能还有 Chrome 都已加入。没有关于停滞不前的微软的 […]

    2009年12月3日 15:57

  17. ant

    在我的 amd64 Linux 系统上无法运行——我尝试使用 radeon git 驱动程序(声称是 OpenGL2.0)并设置 LIBGL_ALWAYS_SOFTWARE 环境变量(声称支持 2.1),但两种方法都不起作用。希望到发布时,这不会变成只有二进制驱动程序才能解决的惨败……

    2010年2月11日 18:48

  18. roy

    关于 VRML 的评论,我从未在任何系统下成功运行过 VRML。事实上,当我尝试使用至少 1/2 打建模器导入和导出 VRML 时,我也同样没有成功。第一次下载并安装 Firefox nightly build 用于 webgl 时,它完美地工作了。我认为除了插件问题之外,还有很多原因导致了 VRML 的消亡。对我来说,它从未工作的经历是决定性因素。

    2010年2月17日 00:00

  19. Alexander

    Windows 7 64 位?无法使用 OSMESA32.DLL、c:WindowsSysWOW64opengl32.dll 或 c:WindowsSystem32opengl32.dll 使其工作。

    2010年3月3日 11:51

  20. […] 用于 WebGL,默认情况下禁用,但可以通过更改首选项启用。有关更多信息,请参阅这篇博文和这篇博文 […]

    2010年3月5日 13:24

  21. […] 用于 WebGL,默认情况下禁用,但可以通过更改首选项启用。有关更多信息,请参阅这篇博文和这篇博文 […]

    2010年3月5日 13:33

  22. anon

    您忘记提及将 webgl.enabled_for_all_sites 设置为启用。

    2010年8月12日 19:50

  23. skierpage

    是否需要更新此示例以使用 Float32Array 而不是 WebGLFloatArray?该示例对我不适用 libOSMesa.so.6,但我没有看到我认为应该看到的 alert(“Please update to a newer Firefox nightly to pick up some WebGL API changes!”)。

    2010年9月16日 02:07

  24. Amir

    WebGL 现在的状态如何?这篇文章发表已经一年了,我们可以在哪里下载最新版本?

    2010年12月19日 11:38

  25. gonebamboo

    WebGL 是否会获得开发 FPS 游戏绝对必要的特性,例如创建关节、基于骨骼的动画、变形和碰撞检测?我可以看到所有这些特性将如何使 javascript 在游戏开发中更加繁琐。

    查看此网站,该网站使用高级面向对象的视觉编程范例来降低开发基于 Web 的 3D 游戏的复杂性。

    http://www.otakhi.com

    2010年12月21日 09:00

  26. wap-tek

    新的 Firefox 中没有状态栏 = 现在您什么也看不到了,
    状态栏可以轻松判断网站链接是否
    对您要去的地方撒谎,而这
    对公司/广告商不利

    webgl = 需要测试版浏览器 = 也许能看到一些东西

    vrml/x3d = 使用插件或查看器
    在任何浏览器中,= 它在 10 年前就可以工作了!

    为什么 Mozilla 不能只使用
    一个通用的 vrml / x3d 插件
    而是使其容错 = 就像
    忽略 10 年前主要参与者故意破坏标准的行为
    谷歌、Mozilla 和许多其他“好人”

    都跳槽了或喝了迷魂汤

    2010年12月25日 04:14

  27. Danny Moules

    “vrml/x3d = 使用插件或查看器
    在任何浏览器中,= 它在 10 年前就可以工作了!”

    这在上面已经讨论过了。这是完全不同的东西。有点像说 Windows 和 DOS 是相同的,因为它们都运行程序,位于文件系统之上并安排 CPU 时间……而且 DOS 完全可以在古老的 x86 硬件上运行。为什么我们需要这个 64 位的 Windows 7?

    “webgl = 需要测试版浏览器 = 也许能看到一些东西”

    直到它不再是测试版..

    “在 Ubuntu 9.04 上也无法使其工作。尝试将 webgl.osmesalib 设置为 /usr/lib/libGL.so,但 getContext 仍然失败。”

    OSMesaLib 是一个软件渲染库。它不是 OpenGL ES。

    “我尝试使用 radeon git 驱动程序(声称是 OpenGL2.0)”

    您需要 OpenGL ES 2.0。

    2011年1月11日 09:21

  28. Danny Moules

    “WebGL 是否会获得开发 FPS 游戏绝对必要的特性,例如创建关节、基于骨骼的动画、变形和碰撞检测。”

    这些与渲染引擎无关。您可以轻松地在 WebGL、DirectX、OpenGL、canvas、SVG 等之间使用相同的碰撞检测和动画引擎。

    2011年1月11日 09:24

  29. Danny Moules

    WebGL 是否会获得开发 FPS 游戏绝对必要的特性,例如创建关节、基于骨骼的动画、变形和碰撞检测。

    2011年1月11日 09:25

  30. LiJian

    我无法下载 webgl-mesa-751.zip。

    2011年7月12日 19:31

    1. louisremi

      如果您使用的是 Firefox 4 或更高版本,则不再需要安装 mesa pilot。

      2011年7月13日 18:37

      1. LiJian

        谢谢。我使用的是 firefox5,但它总是显示“无法初始化 WebGL,抱歉:-(”。

        2011年7月14日 05:06

  31. TheCyndicate

    所有中高端 Intel 显卡都有 OpenGL 驱动程序。

    我就是喜欢无知的 Mac 用户的吐槽,哈哈。

    2011年9月2日 18:18

  32. TheCyndicate

    哈哈哈哈!!

    只有懦夫才会审核帖子!!

    这表明你害怕人们可能发布的真相,哈哈!!

    可悲。

    2011年9月2日 18:20

    1. Robert Nyman(罗伯特·奈曼)

      或者是因为我们有大量的读者,而且有很多垃圾邮件,所以评论需要审核,以避免出现色情或完全无关的内容。

      2011年9月5日 01:33

本文评论已关闭。