我正在嘗試引入Three.js 紋理栩栩如生。我遇到的問題是我的瀏覽器阻止紋理加載，並按照此處的說明修復了該問題。
此外，我正在為我的一個課程建立一個太空導航遊戲，其中包括太空船導航。結果，我渲染了一組行星，地球就是其中之一。我在下面添加了我的地球渲染圖像。它看起來狀況良好，但我正在嘗試通過在其周圍添加“氛圍”來提高其真實感。
我環顧四周，發現了一些使用發光的非常漂亮的創作，但是我不相信它們適用於我的情況。
這是將地球放置在我的場景中的程式碼（這是我從Three.js 獲得的程式碼的修改版本）教學）：
function addEarth(x,y){
var sphereMaterial =
new THREE.MeshLambertMaterial({
//color: 0x0000ff,
map: earthTexture
});
// set up the sphere vars
var radius = 75;
segments = 16;
rings = 16;
// create a new mesh with
// sphere geometry - we will cover
// the sphereMaterial next!
earth = new THREE.Mesh(
new THREE.SphereGeometry(
radius,
segments,
rings),
sphereMaterial);
earth.position.x = x;
earth.position.y = y;
// add the sphere to the scene
scene.add(earth);
}
[編輯3]
這是一個緊湊的 CPU側程式碼範例，我在引擎中使用它來使用上面提供的著色器渲染大氣：
if (sys->_enable_bodya) // has planet atmosphere?
if (view_depth>=0.0)
{
glColor4f(1.0,1.0,1.0,1.0);
double a,b,p[3],d[3];
sys->shd_engine.unbind();
sys->shd_scatter.bind(); // this is the atmospheric shader
if (1) //*** GLSL_uniform_supported (leftover from old GL engine version)
{
int j;
double *w;
AnsiString s;
a=re; b=rp; a=divide(1.0,a*a); b=divide(1.0,b*b); // radius of planet re equatoral and rp polar and ha is atmosphere thickness
sys->shd_scatter.set3f("planet_r",a,a,b);
a=re+ha; b=rp+ha; a=divide(1.0,a*a); b=divide(1.0,b*b);
sys->shd_scatter.set3f("planet_R" ,a,a,b);
sys->shd_scatter.set1f("planet_h" ,ha);
sys->shd_scatter.set1f("view_depth",view_depth); // visibility distance
sys->shd_scatter.set4f("B0",B0[0],B0[1],B0[2],B0[3]); // saturated atmosphere color and overglow
sys->shd_scatter.set1i("lights",sys->local_star.num); // local stars
for (j=0;j<sys->local_star.num;j++)
{
a=sys->local_star[j].r;
w=sys->local_star[j].p;
s=AnsiString().sprintf("light_posr[%i]",j);
sys->shd_scatter.set4f(s,w[0],w[1],w[2],divide(1.0,a*a));
w=sys->local_star[j].d;
s=AnsiString().sprintf("light_dir[%i]",j);
sys->shd_scatter.set3f(s,w[0],w[1],w[2]);
vector_mul(p,sys->local_star[j].col,10.0);
s=AnsiString().sprintf("light_col[%i]",j);
sys->shd_scatter.set3f(s,p[0],p[1],p[2]);
}
}
glEnable(GL_BLEND);
glBlendFunc(GL_ONE,GL_ONE_MINUS_SRC_ALPHA);
a=1.0;
b=-2.0*view.scr->views[view.scr->view].znear;
// color = pixel pos in screen space ... no Projection/ModelView is used :)
// vertex = pixel pos in elypsoid space
// normal = eye-pixel direction in elypsoid space
zsort.rep0.g2l_dir(d,zsort.obj_pos0);
glDepthMask(0);
glBegin(GL_QUADS);
a=divide(1.0,view.zoom);
glColor4d(-1.0,-1.0,0.0,1.0); vector_ld(p,-a,-a,b); view.scr->fromscr(p,p); view.eye0.l2g(q,p); zsort.rep0.g2l_dir(q,q); vector_sub(p,q,d); vector_one(q,q); glNormal3dv(q); glVertex3dv(p);
glColor4d(+1.0,-1.0,0.0,1.0); vector_ld(p,+a,-a,b); view.scr->fromscr(p,p); view.eye0.l2g(q,p); zsort.rep0.g2l_dir(q,q); vector_sub(p,q,d); vector_one(q,q); glNormal3dv(q); glVertex3dv(p);
glColor4d(+1.0,+1.0,0.0,1.0); vector_ld(p,+a,+a,b); view.scr->fromscr(p,p); view.eye0.l2g(q,p); zsort.rep0.g2l_dir(q,q); vector_sub(p,q,d); vector_one(q,q); glNormal3dv(q); glVertex3dv(p);
glColor4d(-1.0,+1.0,0.0,1.0); vector_ld(p,-a,+a,b); view.scr->fromscr(p,p); view.eye0.l2g(q,p); zsort.rep0.g2l_dir(q,q); vector_sub(p,q,d); vector_one(q,q); glNormal3dv(q); glVertex3dv(p);
glEnd();
glDepthMask(1);
glDisable(GL_BLEND);
sys->shd_scatter.unbind();
sys->shd_engine.bind();
}</sys->它取自我的引擎，因此它使用了各種您沒有的東西，但它應該讓您了解如何使用這些東西。例如，g2l_dir 轉換向量而不是位置，l2g 轉換位置而不是向量。 fromscr 將螢幕座標轉換為 3D 座標（相機本地座標），而 vector_one 將向量標準化為單位向量。我希望我沒有忘記解釋任何事情。
以下是大氣散射和GLSL 的一些令人印象深刻的範例：
以上是如何在 Three.js 渲染行星周圍的大氣層？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
