I'm using threeJS combined with a Simplex noise algorithm to generate a tile system of 50x50 planes. At the moment, I'm looping through x+y and adding each plane. I then use the Simplex noise algorithm to calculate the four vertices z position of the plane.
I am using the current x/y as the top left vertice ([0]), and the rest you can see below in the function that generates the tiles initially:
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++;
}
Ok so thats the loop, then the addTile function:
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;
}
(Quick note, I realised I think I don't need to have a new geometry for each plane)
Ok and here is the result:
https://i.sstatic.net/as7hb.jpg
As you can see, the vertices don't line up. I've tried quite a few things, but am totally stumped right now. I'm pretty sure I have the correct vertices being set as TL,TR, etc. Can you spot why the vertices aren't lining up?
Thankyou :) Jack
Ok, it turns out I was passing t and l into the function the wrong way around. Doh!
:)
