用 JavaScript 进行 3D 渲染的最佳在线资源是什么？ [关闭]答案

【问题标题】：What is the best online resource for 3D rendering in JavaScript? [closed]用 JavaScript 进行 3D 渲染的最佳在线资源是什么？ [关闭]
【发布时间】：2010-09-27 16:13:39
【问题描述】：

首先介绍一下：

去年我写了这个http://dragan.yourtree.org/code/canvas-3d-graph/

现在，我想完全重写它，因为旧版本有一些限制，例如：有时会出现条不可见，因为它们是一个接一个地绘制的。

在这个旧版本中，没有真正的 3D，只有一堆 2D 线条，它们模拟 3D。

现在，我想要进入完整的 3D 场景，我想将所有对象保留在内存中，并添加某种 3D 导航按钮，使用户能够在所有 3 轴上旋转整个场景并缩放摄像头进出。

我已经决定将http://sylvester.jcoglan.com/ 用于矢量/矩阵的东西，但我仍然无法找到好的 3D 教程。网上有很多文字，大部分都是90年代的，不完整或者写的很烂。

所以，我的问题是：什么是最好的在线资源/教程，可以让我从头开始编写自己的 JS 3D 引擎。

它应该涵盖所有相关主题：

向量
矩阵
对象
相机
场景渲染
照明
场景中的旋转对象
移动相机

等等。（我对前两个相当熟悉）

感谢您的宝贵时间。

【问题讨论】：

标签： javascript 3d rendering

【解决方案1】：

如果这是专门针对与 JavaScript 相关的项目，那么我理解，但如果您只是为了掌握 3d 渲染的基础知识而这样做，那么可能会有更成熟的平台适合您。

无论如何..

可能对您的学习有用的链接：

还有一些有趣的 JavaScript 3d 示例：

Rotating 3D Cube in JavaScript
Wolfenstein 3D in JavaScript
此 SO 问题中的任何其他内容：Stunning graphic effects with JavaScript?

【讨论】：

【解决方案2】：

只是一些建议，但可能不是您想要的：

我建议您在 nihilogic.dk 上查看 Jacob Seidelin 的画布示例：http://blog.nihilogic.dk/search/label/canvas。

如果您愿意放弃画布并使用现有的 Flash 库，请查看 Sandy3D：http://www.flashsandy.org/demos。

【讨论】：

【解决方案3】：

透视投影： http://www.cse.unr.edu/~bebis/CS791E/Notes/PerspectiveProjection.pdf

【讨论】：

【解决方案4】：

http://www.gamedev.net/

自从上次我尝试用图形/游戏/3D 做任何事情以来已经有一段时间了，但我确实记得这个网站是最广为人知的资源之一。

http://www.gamedev.net/reference/

当然，它是非常通用的，涵盖的内容比您要求的要多，但它包含数学和物理方面的好东西。

【讨论】：

【解决方案5】：

可悲的事实是 JavaScript 中仍然没有真正支持 3D 图形。
因此，您所做的任何事情都必须涉及完全实现 3D 渲染器（或使用其他人已经实现的渲染器）
由于这些东西通常是在硬件中实现的，而您正在编写 JavaScript，因此对于琐碎场景之外的任何事情自然会非常慢。

Java、C# 或 C++ 等语言会更好地为您提供 3D 图形服务。

【讨论】：

【解决方案6】：

有一种名为"Canvas 3D" 的技术可用于 Firefox。还有一个名为C3DL 的实用程序，可以更轻松地使用这项技术。

不幸的是，据我所知，没有等效的 Opera/Internet Explorer/WebKit - 此插件仅适用于 Firefox 3（不支持 Firefox 2 和 Firefox 3.1 beta）...

【讨论】：

4 年后 - 在所有新浏览器中都可以找到 WebGL！
@kodisha 没有无插件的 IE 支持。