Want to merge them and find their edge line

Questions
,
1

I Have basic problem I have two geometry ı want to merge them and find their edge line
const boxGeometry1 = new THREE.BoxGeometry(5, 5, 10);
boxGeometry1.translate(2, 1, -3);
const windowGeometry = new THREE.BoxGeometry(10, 5, 5);
windowGeometry.translate(4.5, 1, 4.5);
const mergedGeometry = mergeGeometries([boxGeometry1, windowGeometry]);
var mergedMesh = new THREE.Mesh(mergedGeometry);

var wireframe = new THREE.EdgesGeometry(mergedGeometry);

var lineSegments = new THREE.LineSegments(wireframe);

scene.add(lineSegments);

Untitleddas
Untitleddas1033×517 13.9 KB

but it is drawing separate geometries edge lines.

I want to merge them with another methods ı faced with problem specificly about
spliting geometries to their faces.
Uncaught TypeError: Cannot read properties of undefined (
Eror for these geometry.face operation.
how can ı find merged geometries edgelines with only merged geometry edgelines.

2

I think you’re encountering one of those operations that seems like it should be simple but isn’t. mergeGeometries, as far as I know, is a fairly basic operation that just combines the geometric data into a single bufferGeometry object. As far as i know, it does not perform any face/edge splitting.

I think you would have to either split the edges yourself, or look into using an external library. THREE-BVH-CSG might be appropriate, though, you still might run into issues with half edges not being mirrored, in which case you might need to look for a different edge detection algorithm.

3

Thank you for your insterest. Do you know any library or example for that edge operation or merge opereations.

4

I don’t know if anyone else cares but I solved it this way.

const wallGeometry = new THREE1.BoxGeometry(0.2, 5, 2);

const wallMaterial = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh = new THREE1.Mesh(wallGeometry, wallMaterial);

//scene.add(wallMesh);

wallMesh.position.set(0, 0, -1.1);

wallMesh.updateMatrix();

const wallGeometry1 = new THREE1.BoxGeometry(0.2, 5, 0.2);

const wallMaterial1 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh1 = new THREE1.Mesh(wallGeometry1, wallMaterial1);

//scene.add(wallMesh);

wallMesh1.position.set(0, 0, 0);

wallMesh1.updateMatrix();

const wallGeometry2 = new THREE1.BoxGeometry(0.2, 5, 0.2);

const wallMaterial2 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh2 = new THREE1.Mesh(wallGeometry2, wallMaterial2);

wallMesh2.position.set(2.2, 0, 0);

wallMesh2.updateMatrix();

//scene.add(wallMesh2);

const wallGeometry3 = new THREE1.BoxGeometry(0.2, 5, 1.2);

const wallMaterial3 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh3 = new THREE1.Mesh(wallGeometry3, wallMaterial3);

wallMesh3.position.set(2.2, 0, -0.7);

wallMesh3.updateMatrix();

//scene.add(wallMesh3);

const wallGeometry4 = new THREE1.BoxGeometry(2.2, 5, 0.2);

const wallMaterial4 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh4 = new THREE1.Mesh(wallGeometry4, wallMaterial4);

wallMesh4.position.set(3.4, 0, -1.4);

wallMesh4.updateMatrix();

//scene.add(wallMesh4);

const wallGeometry5 = new THREE1.BoxGeometry(0.2, 5, 0.2);

const wallMaterial5 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh5 = new THREE1.Mesh(wallGeometry5, wallMaterial5);

wallMesh5.position.set(2.2, 0, -1.4);

wallMesh5.updateMatrix();

//scene.add(wallMesh5);

const wallGeometry6 = new THREE1.BoxGeometry(0.2, 5, 1.2);

const wallMaterial6 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh6 = new THREE1.Mesh(wallGeometry6, wallMaterial6);

wallMesh6.position.set(4.6, 0, -0.7);

wallMesh6.updateMatrix();

//scene.add(wallMesh6);

const wallGeometry7 = new THREE1.BoxGeometry(0.2, 5, 0.2);

const wallMaterial7 = new THREE1.MeshStandardMaterial({ color: 0x00ff00 });

const wallMesh7 = new THREE1.Mesh(wallGeometry7, wallMaterial7);

wallMesh7.position.set(4.6, 0, -1.4);

wallMesh7.updateMatrix();

//scene.add(wallMesh7);

// Daire (Pencere) olusturuluyor

const windowGeometry = new THREE1.BoxGeometry(2, 5, 0.2);

const windowMaterial = new THREE1.MeshStandardMaterial({ color: 0x00ff00, side: THREE1.DoubleSide });

const windowMesh = new THREE1.Mesh(windowGeometry, windowMaterial);

//windowMesh.position.set(1, 5555, 0.05); // Duvarin içine yerlestiriliyor

windowMesh.position.set(1.1, 0, 0);

windowMesh.updateMatrix();

// Duvar ve Pencere CSG nesneleri olusturuluyor

const wallCSG = CSG.fromMesh(wallMesh);

const wallCSG1 = CSG.fromMesh(wallMesh1);

const wallCSG2 = CSG.fromMesh(wallMesh2);

const wallCSG3 = CSG.fromMesh(wallMesh3);

const wallCSG4 = CSG.fromMesh(wallMesh4);

const wallCSG5 = CSG.fromMesh(wallMesh5);

const wallCSG6 = CSG.fromMesh(wallMesh6);

const wallCSG7 = CSG.fromMesh(wallMesh7);

const windowCSG = CSG.fromMesh(windowMesh);

const resultCSG1 = wallCSG.union(wallCSG1);

const resultCSG2 = resultCSG1.union(windowCSG);

const resultCSG3 = resultCSG2.union(wallCSG2);

const resultCSG4 = resultCSG3.union(wallCSG3);

const resultCSG5 = resultCSG4.union(wallCSG4);

const resultCSG6 = resultCSG5.union(wallCSG5);

const resultCSG7 = resultCSG6.union(wallCSG6);

const resultCSG = resultCSG7.union(wallCSG7);

let CountResult1 = CSG.toMesh( resultCSG, CounterSt.matrix, wallMaterial1 );

//scene.add( CountResult1 );

let matLine1 = new LineMaterial( {

color: 0xff0000,

linewidth: 4, // in pixels

//resolution: // to be set by renderer, eventually

dashed: false

} );

matLine1.resolution.set( window.innerWidth, window.innerHeight );

const CountEdge1 = new THREE.EdgesGeometry( CountResult1.geometry );

const CountLine1 = new LineSegmentsGeometry().setPositions( CountEdge1.attributes.position.array );

const CountLinePav1 = new LineSegments2( CountLine1, matLine1 );

CountLinePav1.position.set( CountResult1.position.x,CountResult1.position.y,CountResult1.position.z);

//scene.add( CountLinePav1 );

Capture
Capture821×666 17 KB