three#Face3 JavaScript Examples

The following examples show how to use three#Face3. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: half_edge.js    From architect3d with MIT License 6 votes vote down vote up 
/**
	 * This generates the invisible planes in the scene that are used for interesection testing for the wall items
	 */
	generatePlane()
	{
		var geometry = new Geometry();
		var v1 = this.transformCorner(this.interiorStart());
		var v2 = this.transformCorner(this.interiorEnd());
		var v3 = v2.clone();
		var v4 = v1.clone();

		// v3.y = this.wall.height;
		// v4.y = this.wall.height;

		v3.y = this.wall.startElevation;
		v4.y = this.wall.endElevation;

		geometry.vertices = [v1, v2, v3, v4];
		geometry.faces.push(new Face3(0, 1, 2));
		geometry.faces.push(new Face3(0, 2, 3));
		geometry.computeFaceNormals();
		geometry.computeBoundingBox();


		this.plane = new Mesh(geometry, new MeshBasicMaterial({visible:true}));
		//The below line was originally setting the plane visibility to false
		//Now its setting visibility to true. This is necessary to be detected
		//with the raycaster objects to click walls and floors.
		this.plane.visible = true;
		this.plane.edge = this; // js monkey patch


		this.computeTransforms(this.interiorTransform, this.invInteriorTransform, this.interiorStart(), this.interiorEnd());
		this.computeTransforms(this.exteriorTransform, this.invExteriorTransform, this.exteriorStart(), this.exteriorEnd());

		var b3 = new Box3();
		b3.setFromObject(this.plane);
		this.min = b3.min.clone();
		this.max = b3.max.clone();
		this.center = this.max.clone().sub(this.min).multiplyScalar(0.5).add(this.min);
	}
Example #2
Source File: room.js    From architect3d with MIT License 6 votes vote down vote up 
generateRoofPlane()
	{
		if(this.roofPlane && this.roofPlane != null)
		{
			if(this.roofPlane.parent != null)
			{
					this.roofPlane.parent.remove(this.roofPlane);
			}
		}
		// setup texture
		var geometry = new Geometry();

		this.corners.forEach((corner) => {
			var vertex = new Vector3(corner.x,corner.elevation, corner.y);
			geometry.vertices.push(vertex);
		});
		for (var i=2;i<geometry.vertices.length;i++)
		{
			var face = new Face3(0, i-1, i);
			geometry.faces.push(face);
		}
		this.roofPlane = new Mesh(geometry, new MeshBasicMaterial({side: DoubleSide, visible:false}));
		this.roofPlane.room = this;
	}
Example #3
Source File: edge.js    From architect3d with MIT License 6 votes vote down vote up 
buildSideFillter(p1, p2, height, color)
	{
		var points = [this.toVec3(p1), this.toVec3(p2), this.toVec3(p2, height), this.toVec3(p1, height) ];

		var geometry = new Geometry();
		points.forEach((p) => {
			geometry.vertices.push(p);
		});
		geometry.faces.push(new Face3(0, 1, 2));
		geometry.faces.push(new Face3(0, 2, 3));

		var fillerMaterial = new MeshBasicMaterial({color: color,side: DoubleSide});
		var filler = new Mesh(geometry, fillerMaterial);
		return filler;
	}
Example #4
Source File: edge.js    From architect3d with MIT License 6 votes vote down vote up 
buildFillerVaryingHeights(edge, side, color)
	{
		var a = this.toVec3(edge.exteriorStart(), this.edge.getStart().elevation);
		var b = this.toVec3(edge.exteriorEnd(), this.edge.getEnd().elevation);
		var c = this.toVec3(edge.interiorEnd(), this.edge.getEnd().elevation);
		var d = this.toVec3(edge.interiorStart(), this.edge.getStart().elevation);
		
//		var a = this.toVec3(edge.exteriorStart(), this.wall.getClosestCorner(edge.exteriorStart()).elevation);
//		var b = this.toVec3(edge.exteriorEnd(), this.wall.getClosestCorner(edge.exteriorEnd()).elevation);
//		var c = this.toVec3(edge.interiorEnd(), this.wall.getClosestCorner(edge.interiorEnd()).elevation);
//		var d = this.toVec3(edge.interiorStart(), this.wall.getClosestCorner(edge.interiorStart()).elevation);
		
		
		var fillerMaterial = new MeshBasicMaterial({color: color,side: side});

		var geometry = new Geometry();
		geometry.vertices.push(a,b,c,d);
		geometry.faces.push(new Face3(0, 1, 2));
		geometry.faces.push(new Face3(0, 2, 3));

		var filler = new Mesh(geometry, fillerMaterial);
		return filler;
	}
Example #5
Source File: floor.js    From architect3d with MIT License 6 votes vote down vote up 
buildRoofVaryingHeight()
	{
		// setup texture
		var roofMaterial = new MeshBasicMaterial({side: FrontSide,color: 0xe5e5e5});
		var geometry = new Geometry();

		this.room.corners.forEach((corner) => {
			var vertex = new Vector3(corner.x,corner.elevation, corner.y);
			geometry.vertices.push(vertex);
		});
		for (var i=2;i<geometry.vertices.length;i++)
		{
			var face = new Face3(0, i-1, i);
			geometry.faces.push(face);
		}
		var roof = new Mesh(geometry, roofMaterial);
		// roof.rotation.set(Math.PI / 2, 0, 0);
		// roof.position.y = Configuration.getNumericValue(configWallHeight);
		return roof;
	}
Example #6
Source File: utils.js    From cga.js with MIT License 6 votes vote down vote up 
export function toMesh(obj, materialOption) {
    var renderObj = null;
    if (obj instanceof cga.Point || obj.isVec3) {
        var geometry = new BufferGeometry()
        geometry.setAttribute('position', new Float32BufferAttribute([obj.x, obj.y, obj.z], 3));
        var material = new PointsMaterial({ size: 5, sizeAttenuation: false, color: 0x0ff0f0, alphaTest: 0.9, transparent: true });
        renderObj = new Points(geometry, material);

    } else if (obj instanceof cga.Line) {
        var geometry = new Geometry()
        var v1 = obj.direction.clone().multiplyScalar(10000).add(obj.origin);
        var v2 = obj.direction.clone().multiplyScalar(-10000).add(obj.origin);
        geometry.vertices.push(v1, v2);
        var material = new LineBasicMaterial({ color: 0xffff8f });
        renderObj = new Line(geometry, material);

    } else if (obj instanceof cga.Ray) {
        var geometry = new Geometry()
        var v1 = obj.direction.clone().multiplyScalar(10000).add(obj.origin);
        geometry.vertices.push(obj.origin, v1);
        var material = new LineBasicMaterial({ color: 0xff8fff });
        renderObj = new Line(geometry, material);
    } else if (obj instanceof cga.Segment) {
        var geometry = new Geometry()
        geometry.vertices.push(obj.p0, obj.p1);
        var material = new LineBasicMaterial({ color: 0x8fffff });
        renderObj = new Line(geometry, material);
    } else if (obj instanceof cga.Triangle) {
        var geometry = new Geometry()
        geometry.vertices = [...obj];
        geometry.faces.push(new Face3(0, 1, 2))
        var material = new MeshBasicMaterial({ color: 0x8f8fff, side: DoubleSide });
        renderObj = new Mesh(geometry, material);
    }

    else if (obj instanceof cga.Polyline) {
        var geometry = new Geometry()
        geometry.vertices.push(...obj);
        var material = new LineBasicMaterial({ color: 0xff8fff });
        renderObj = new Line(geometry, material);
    } else if (obj instanceof cga.Polygon) {

    } else if (obj instanceof cga.Circle) {
        var geometry = new Geometry()
        var radius = obj.radius;
        for (let i = 0; i <= 128; i++) {
            var p = new Vector3();
            p.x = radius * Math.cos(Math.PI / 64 * i);
            p.y = radius * Math.sin(Math.PI / 64 * i);
            geometry.vertices.push(p);
        }
        var quaternion = getQuaternionForm2V(new Vector3(0, 0, 1), obj.normal);
        var mat4 = new Matrix4();
        mat4.makeRotationFromQuaternion(quaternion);
        geometry.applyMatrix(mat4);
        geometry.translate(obj.center.x, obj.center.y, obj.center.z);
        var material = new LineBasicMaterial({ color: 0x8fffff });
        renderObj = new Line(geometry, material);
        renderObj.add(new toMesh(obj.center))
        renderObj.add(new toMesh(new cga.Ray(obj.center, obj.normal)))
    }
    else if (obj instanceof cga.Disk) {
        var geometry = new CircleGeometry(obj.radius, 128)
        var material = new MeshBasicMaterial({ color: 0x8f8fff, side: DoubleSide });
        var quaternion = getQuaternionForm2V(new Vector3(0, 0, 1), obj.normal);
        var mat4 = new Matrix4();
        mat4.makeRotationFromQuaternion(quaternion);
        geometry.applyMatrix4(mat4);
        geometry.translate(obj.center.x, obj.center.y, obj.center.z);
        renderObj = new Mesh(geometry, material);
        renderObj.add(new toMesh(obj.center))
        renderObj.add(new toMesh(new cga.Ray(obj.center, obj.normal)))
    }

    return renderObj;

}