# Add different geometries to one single geometry

Hi there,

is it possible to create one single geometry out of different other geometries? What i want to achieve:

• I have a array with x any y coordinates: [{x1, y1}, {x2, y2}, {x3, y3}, …, ]

• In every position (x,y) e.g. a cylinder Mesh should be positioned

Let’s say there are 7 positions, so there are 7 cylinders, how can i combine them into one single geometry?

Hi!
Single geometry of seven cylinders (used `mergeGeometries` of `BufferGeometryUtils`):

Perfect, exactly what i was looking for! Thank you

1 Like

You’re welcome

2 Likes

there’s also csg, it might be easier to compose and now you can also subtract and intersect GitHub - pmndrs/react-three-csg: 🚧 Constructive solid geometry for React

``````<mesh>
<Geometry>
<Base>
<boxGeometry args={[1, 2, 3]} />
</Base>
<Addition position={[0, 0.5, 0]} rotation={[Math.PI / 2, 0, 0]}>
<cylinderGeometry args={[1, 2]} />
{/* ... You can add more */}
</Geometry>
<meshStandardMaterial />
</mesh>``````
1 Like

Ahh nice, havent thought about CSG although i am using it already to subtract. So is it possible for me to first add different geometries to merge them and then subtract the merged geometry from another?

Btw this is how i’m using it right now, thanks to @prisoner849 for the help:

``````const arrayOfPoints = [
{ y: posY1, z: posZ1 },
{ y: posY1, z: posZ2 },
{ y: posY1, z: posZ3 },
{ y: posY1_o, z: posZ1 },
{ y: posY1_o, z: posZ2 },
{ y: posY1_o, z: posZ3 },
{ y: posY1_u, z: posZ1 },
{ y: posY1_u, z: posZ2 },
{ y: posY1_u, z: posZ3 },
{ y: posY2, z: posZ1 },
{ y: posY2, z: posZ2 },
{ y: posY2, z: posZ3 },
{ y: posY2_o, z: posZ1 },
{ y: posY2_o, z: posZ2 },
{ y: posY2_o, z: posZ3 },
{ y: posY2_u, z: posZ1 },
{ y: posY2_u, z: posZ2 },
{ y: posY2_u, z: posZ3 },
{ y: posY3, z: posZ1 },
{ y: posY3, z: posZ2 },
{ y: posY3, z: posZ3 },
{ y: posY3_o, z: posZ1 },
{ y: posY3_o, z: posZ2 },
{ y: posY3_o, z: posZ3 },
{ y: posY3_u, z: posZ1 },
{ y: posY3_u, z: posZ2 },
{ y: posY3_u, z: posZ3 },
{ y: posY4, z: posZ1 },
{ y: posY4, z: posZ2 },
{ y: posY4, z: posZ3 },
{ y: posY4_o, z: posZ1 },
{ y: posY4_o, z: posZ2 },
{ y: posY4_o, z: posZ3 },
{ y: posY4_u, z: posZ1 },
{ y: posY4_u, z: posZ2 },
{ y: posY4_u, z: posZ3 },
];

let geom;

const bgsOffset = BGS ? 0.0002 : 0;

useLayoutEffect(() => {
if (LIN_FRÄ === "Linien Typ Rundrille") {
geom = mergeGeometries(
arrayOfPoints.map((e) => {
return new THREE.IcosahedronGeometry(0.0021, 3)
.rotateZ(Math.PI / 2)
.translate(0.0206 * spiegelung, e.y, e.z);
})
);
} else if (LIN_FRÄ === "Linien Typ Planfuge") {
geom = mergeGeometries(
arrayOfPoints.map((e) => {
return new THREE.CylinderGeometry(0.005, 0.005, 0.0016, 18)
.rotateZ(Math.PI / 2)
.translate(0.02 * spiegelung, e.y, e.z);
})
);
} else if (LIN_FRÄ === "Linien Typ V-Fuge") {
geom = mergeGeometries(
arrayOfPoints.map((e) => {
return new THREE.CylinderGeometry(0.00125, 0.00025, 0.0015, 12, 1)
.rotateZ((-Math.PI / 2) * spiegelung)
.translate((0.01925 + bgsOffset) * spiegelung, e.y, e.z);
})
);
} else {
geom = geometry;
}

meshRef.current.geometry = geom;
}, [LIN_FRÄ]);

return (
<>
<Subtraction ref={meshRef}>
<meshStandardMaterial color={LIN_FARBE} />
</Subtraction>
</>
);
``````