My heightmap-based plane is not working with raycasting, and I'm also having trouble placing an object above the hovered triangle.
UPDATE: By commenting out the height section (pgeo.vertices[i].z = heightmap[i] * 5;), it seems to work inconsistently. The highlighting appears sometimes depending on the camera angle. Zooming in or out causes the triangle to disappear and reappear unpredictably.
I used the voxelpainter example as a basis for this jsfiddle:
http://jsfiddle.net/waf6u7xp/1/
However, I'm unsure if there's a better way to determine the hovered triangle. Maybe projection based on the heightmap would be more effective? Any suggestions?
This is the code responsible for the raycast:
function onDocumentMouseMove( event ) {
event.preventDefault();
mouse2D.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse2D.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
var vector = new THREE.Vector3( mouse2D.x, mouse2D.y, camera.near );
projector.unprojectVector( vector, camera );
var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
var intersects = raycaster.intersectObjects(objects);
// Toggle rotation bool for meshes that we clicked
if ( intersects.length > 0 ) {
var match = intersects[0];
console.log(match);
selectedTile = match.faceIndex;
var f = face = match.face;
var faceIdx = match.faceIndex;
var faces = match.object.geometry.faces;
var vertices = match.object.geometry.vertices;
var fa = vertices[f.a];
var fb = vertices[f.b];
var fc = vertices[f.c];
var a = fa.clone();
var b = fb.clone();
var c = fc.clone();
highlightpla.geometry.vertices[0].setX(Math.ceil(a.x));
highlightpla.geometry.vertices[0].setY(Math.ceil(a.y));
highlightpla.geometry.vertices[0].setZ(a.z+1);
highlightpla.geometry.vertices[1].setX(Math.ceil(b.x));
highlightpla.geometry.vertices[1].setY(Math.ceil(b.y));
highlightpla.geometry.vertices[1].setZ(b.z+1);
highlightpla.geometry.vertices[2].setX(Math.ceil(c.x));
highlightpla.geometry.vertices[2].setY(Math.ceil(c.y));
highlightpla.geometry.vertices[2].setZ(c.z+1);
}
}