简体繁体 English

与three.js的背景

[英]Background with three.js

原文 2012-04-20 23:55:33 0 2 javascript/ webgl/ three.js

Can anybody help me with three.js? 有人可以帮助我使用three.js吗？

I need to draw background, something, like a THREE.Sprite, but it neet to be UNDER any 3d object, that will draw later. 我需要绘制背景，例如THREE.Sprite，但是在任何3d对象下都可以，稍后再绘制。 I have a camera, that can be move only on Z axis. 我有一个相机，只能在Z轴上移动。

I tryed to use: 我尝试使用：

cube mapping shader - PROBLEM: artefacts with shadow planes, it's unstable draw 立方体贴图着色器-问题：带有阴影平面的伪像，绘制不稳定
THREE.Sprite that dublicate camera moving - PROBLEM: artefacts with shadow plane - it have a edge highlighting OR drawing only other spirtes without objects. 三，使摄影机运动重复的精灵-问题：带有阴影平面的伪像-它具有突出显示的边缘或仅绘制其他没有物体的精灵。
HTML DOM Background - PROBLEM: big and ugly aliasing in models. HTML DOM背景-问题：模型中的别名大而丑陋。

What can I try more? 我还能尝试什么？ Thanks! 谢谢！

2 个解决方案

You could maybe try drawing in several passes, ie making a first render of the background scene to a buffer, and then a second one over the first "buffer". 您可以尝试多次绘制，即将背景场景的第一个渲染渲染到缓冲区，然后在第一个“缓冲区”上渲染第二个场景。 Maybe using the buffer as background (painting it in 2D with an orthographic projection, and disabling depth buffer writes in that pass). 也许使用缓冲区作为背景（使用正交投影在2D中绘画它，并在该遍中禁用深度缓冲区写入）。

I haven't tried it myself with three.js, but that's how I'd do that with "traditional" OpenGL. 我还没有亲自使用three.js进行过尝试，但这就是我使用“传统” OpenGL进行尝试的方式。

If you want a "3d" background ie something that will follow the rotation of your camera, but not react to the movement (be infinitely far), then the only way to do it is with a cubemap. 如果您想要“ 3d”背景，即跟随相机旋转但对移动没有反应（无限远）的东西，那么唯一的方法就是使用立方体贴图。

The other solution is a environment dome - a fully 3d object. 另一个解决方案是环境球-完整的3D对象。

If you want a static background, then you should be able todo just a html background, i'm not sure why this would fail and what 'aliasing in models' you are talking about. 如果您想要一个静态背景，那么您应该只能做一个html背景，我不确定为什么会失败以及您在说什么“模型混叠”。