easy-three

tool.csg

tool.csg(mesh1: Mesh, mesh2: Mesh, props?) : Mesh

mesh1 - 最初のメッシュ。
mesh2 - 2番目のメッシュ。
props - その他のプロパティ (オプション)。
  • mode - CSG のモード。(デフォルト: "subtract")
    • "add" - 加算 (ADDITION)
    • "subtract" - 減算 (SUBTRACTION)
    • "reverseSubtract" - 逆減算 (REVERSE_SUBTRACTION)
    • "difference" - 差分 (DIFFERENCE)
    • "intersect" - 交差 (INTERSECTION)
  • dispose - 元のメッシュのジオメトリとマテリアルを破棄するかどうか。デフォルトは true。
  • remove - 元のメッシュをシーンから削除するかどうか。デフォルトは true。
メッシュ同士のブーリアン演算を行い、新しいメッシュを生成します。
このメソッドは three-bvh-csg を easy-three で利用しやすくしたラッパーです。
元のメッシュは、props の設定に応じて破棄またはシーンから削除されます。
新しいメッシュの位置、回転、マテリアルなどの情報は、最初のメッシュ (mesh1) の情報を引き継ぎます。

使用例

2つのメッシュを引数にして tool.csg() を呼び出すことで、ブーリアン演算が行われます。
基本は減算 (subtract) ですが、props の mode を変更することで、加算や交差などの演算も可能です。

tool.csg(mesh1, mesh2);

加算の場合は次のようになります。

tool.csg(mesh1, mesh2, { mode: "add" });

サンプルコード

立方体から球を減算

長さ1の立方体と、半径0.7の球を用意し、立方体から球を減算する例です。
立方体と球は、CSG 演算後にシーンから削除されます。

const { camera, create, animate, controls, tool } = init();
camera.position.set(0, 1.6, 2)
controls.connect()

create.ambientLight();
create.directionalLight();
create.sky()

const cube = create.cube();

const sphere = create.sphere({
  size: 0.7,
});

tool.csg(cube, sphere)

animate();

立方体から球を減算

長さ1の立方体と、半径0.7の球を用意し、立方体から球を減算する例です。
こちらの例では、立方体と球は、CSG 演算後も削除されません。
立方体は autoAdd: false に設定されているため、シーンには追加されず、演算後のメッシュと球のみがシーンに残ります。

const { camera, create, animate, controls, tool } = init();
camera.position.set(0, 1.6, 2)
controls.connect()

create.ambientLight();
create.directionalLight();
create.sky()

const cube = create.cube({
  autoAdd: false
});

const sphere = create.sphere({
  size: 0.7,
  option: {
    color: 0xffcccc,
    transmission: 0.9,
    roughness: 0,
    thickness: 0.5,
  }
});

tool.csg(cube, sphere, {
  dispose: false,
  remove: false,
})

animate();