I am currently working on developing a house generator using a floorplan. The mesh generation process is running smoothly, but now I am faced with the task of flipping the normals on certain faces.
buildRoomMeshFromPoints(planeScalar, heightScalar){
var pointsAsVector2 = []
this.points.map(e => {
pointsAsVector2.push(new THREE.Vector2(e.x * planeScalar, e.y * planeScalar))
})
var shape = new THREE.Shape();
shape.moveTo(pointsAsVector2[0].x, pointsAsVector2[0].y)
pointsAsVector2.shift()
pointsAsVector2.forEach(e => shape.lineTo(e.x, e.y))
const extrusionSettings = {
steps: 2,
depth: heightScalar,
bevelEnabled: false
};
var roomGeometry = new THREE.ExtrudeGeometry( shape, extrusionSettings );
var materialFront = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
var materialSide = new THREE.MeshBasicMaterial( { color: 0xff8800 } );
var materialArray = [ materialFront, materialSide ];
var roomMaterial = new THREE.MeshFaceMaterial(materialArray);
var room = new THREE.Mesh(roomGeometry, roomMaterial);
room.position.set(0,0,0);
room.rotation.set(THREE.MathUtils.degToRad(-90),0,0)
return room;
}
This piece of code is responsible for creating the house structure based on a set of 2D points. In order to make the walls transparent, I need to adjust the normals of all walls and the roof.
My plan involves evaluating the angle between each face normal and an upward vector (THREE.Vector3(0,1,0)), and if the angle exceeds a certain threshold, I aim to flip it. However, I am unsure about how to achieve this at the moment :)
Any assistance would be greatly appreciated!
Warm regards, Pascal