# THREE.js Placing objects on top of Terrain

Following the THREE.js example here (at line # 198 to exact) I created a floor using `PlaneGeometry` as follows:

``````  geometry = new THREE.PlaneGeometry( 2000, 2000, 100, 100 );
geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );

for ( var i = 0, l = geometry.vertices.length; i < l; i ++ ) {

var vertex = geometry.vertices[ i ];
vertex.x += Math.random() * 20 - 10;
vertex.y += Math.random() * 2;
vertex.z += Math.random() * 20 - 10;

}
``````

(You can see what that floor actually looks like here: floor)

I now want to randomly place 100 spheres on this floor, but since the floorâ€™s height undulates and changes throughout (itâ€™s really more of a terrain than a â€śfloorâ€ť) I donâ€™t know how to calculate the `"y"` coordinate for any given `(x, y, z)` point on this terrain.
I know how to do it with `raycaster` - but thatâ€™s during run-time. I need to figure out the y-values prior to run-time, because right now, my spheres are all either submerged under the terrain or kinda half popping above it.

How does one go about doing this?

You might find THREE.MeshSurfaceSampler useful. It does require BufferGeometry, not Geometry, though.

2 Likes

Awesome - didnâ€™t even know `MeshSurfaceSampler` existed - but got it working already!