Add different geometries to one single geometry

Questions
, ,
1

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?

Any advice would be helpful!:slight_smile: Thanks

2

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

3

Perfect, exactly what i was looking for! Thank you

1 Like
4

You’re welcome :slight_smile: :handshake:

2 Likes
5

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]} />
    </Addition>
    {/* ... You can add more */}
  </Geometry>
  <meshStandardMaterial />
</mesh>
1 Like
6

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?

7

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>
    </>
  );