gkjohnson / three-bvh-csg

A flexible, memory compact, fast and dynamic CSG implementation on top of three-mesh-bvh
MIT License
548 stars 45 forks source link

Texture not showing when exporting scene #186

Closed Kalabedo closed 6 months ago

Kalabedo commented 6 months ago

I used this library to cut stuff from simple geometries when i want to export the newly built geometries the material on it is not correct. In the renderer everything looks fine. As soon as i export the scene via GLTFExporter the mesh has two seperate textures on top of each other. Resulting in this (opened in Blender):

image

In the renderer it looks like this: Subtraction

This is the code i'm using (i played with useGroups / consolidateMaterials without sucess):

// Object1
const geometry = new THREE.BoxGeometry(1, 1, 1)
const material = new THREE.MeshStandardMaterial({ 
  map: texture, 
})

// Object2
const geometry2 = new THREE.BoxGeometry(.1, 1, .1)
const material2 = new THREE.MeshStandardMaterial({ 
  color: "#232323"
})

// CSG
const brush1 = new Brush( geometry );
brush1.material = material
brush1.updateMatrixWorld();

const brush2 = new Brush( geometry2 );
brush2.material = material2
brush2.position.z = 0.45;
brush2.updateMatrixWorld();

const evaluator = new Evaluator();
evaluator.useGroups = true
evaluator.consolidateMaterials = true
const result = evaluator.evaluate( brush1, brush2, SUBTRACTION );
scene.add(result)
gkjohnson commented 6 months ago

From the docs:

CSG results use Geometry.drawRange to help maintain performance which can cause three.js exporters to fail to export the geometry correctly. It is necessary to convert the geometry to remove the use of draw range before exporting with three.js exporters.

gkjohnson commented 6 months ago

Either way this is an issue related to an exporter if three.js is not exporting geometry as it's rendered in the application and should be reported elsewhere. At least a warning should be logged.

Kalabedo commented 6 months ago

Either way this is an issue related to an exporter if three.js is not exporting geometry as it's rendered in the application and should be reported elsewhere. At least a warning should be logged.

I tried with other CSG libraries and the exporting works fine so i thought the implementation in this library does something different with the materials

Kalabedo commented 6 months ago

Here is a fix:

// CSG
const brush1 = new Brush( geometry );
brush1.material = material
brush1.updateMatrixWorld();

const brush2 = new Brush( geometry2 );
brush2.material = material2
brush2.position.z = 0.45;
brush2.updateMatrixWorld();

const evaluator = new Evaluator();
evaluator.useGroups = true
evaluator.consolidateMaterials = true
const result = evaluator.evaluate( brush1, brush2, SUBTRACTION );

let index = [];
for (let i = 0; i < result.geometry.attributes.position.count; i++)
  index.push(i);
result.geometry.setIndex(index);

scene.add(result)

With the help of thrax, we found out, that the geometry is not indexed after the subtraction. setting an index fixed the issue with exporting. So you were right i think, it is an Exporter issue