threeJS程序平面顶点未对齐

时间:2013-09-22 11:56:27

标签: javascript three.js vertices procedural-generation simplex-noise

我正在使用threeJS结合Simplex噪声算法来生成50x50平面的平铺系统。目前,我正在循环x + y并添加每个平面。然后我使用Simplex噪声算法计算平面的四个顶点z位置。

我使用当前的x / y作为左上顶点([0]),其余的你可以在最初生成tile的函数中看到:

        PerlinSimplex.noiseDetail(4,0.5);

        x=0;
        y=0;

        while (x<32) {
            while (y<32) {
                l=(x*tilesize)+(tilesize/2);
                t=(y*tilesize)+(tilesize/2);
                //fScl= .07;
                fScl= 1;
                xx=x*fScl;
                yy=y*fScl;

                tl=Math.floor((PerlinSimplex.noise(xx,yy))*100);
                bl=Math.floor((PerlinSimplex.noise(xx,yy-1))*100);
                br=Math.floor((PerlinSimplex.noise(xx+1,yy-1))*100);
                tr=Math.floor((PerlinSimplex.noise(xx+1,yy))*100);

                addTile(t,l,tl,tr,bl,br);
                y++;
            }
            y=0;
            x++;
        }

好的就是循环,然后是addTile函数:

    function addTile(x,y,tl,tr,bl,br) {

        var geo=new THREE.PlaneGeometry(tilesize, tilesize);
        geo.dynamic = true;

        geos.push(geo);

        var plane = new THREE.Mesh(geo, col);
        plane.overdraw = true;

        plane.geometry.vertices[0].z=tl;
        plane.geometry.vertices[1].z=tr;
        plane.geometry.vertices[2].z=bl;
        plane.geometry.vertices[3].z=br;


        plane.geometry.computeFaceNormals();
        plane.geometry.computeVertexNormals();    
        plane.geometry.__dirtyNormals = true;

        plane.position.x=x;
        plane.position.y=y;
        plane.position.z=0;

        scene.add(plane);

        planes.push(plane);

        plane.geometry.verticesNeedUpdate = true;

        // changes to the normals
        plane.geometry.normalsNeedUpdate = true;

    }

(快速注意,我意识到我认为我不需要为每个平面都有一个新的几何体)

好的,结果如下:

http://i.imgur.com/h4XNEYj.jpg

如您所见,顶点不对齐。我已经尝试了很多东西,但现在我完全被困住了。我很确定我将正确的顶点设置为TL,TR等。你能发现顶点没有排列的原因吗?

谢谢你:) 千斤顶

1 个答案:

答案 0 :(得分:0)

好吧,事实证明我是以错误的方式将t和l传递给函数。卫生署!

:)