Why are these lines created, in gltf model?

Questions
,
1

Hi… when i open model in gltf viewer https://gltf-viewer.donmccurdy.com/ it looks fine.
dump1

but when i try to import it using my own viewr. why are these lines created.
dump2

My Code:

function addglass() {	
	const loader = new THREE.GLTFLoader();
        const threeGlasses = new THREE.Object3D();
	loader.load( './model/goggles.glb', function (glassesFramesGeometry){
		var glass = glassesFramesGeometry.scene;
		threeGlasses.add(glass);
		threeGlasses.scale.set( 0.08, 0.08, 0.08);
		threeGlasses.rotation.x = 70*Math.PI/180;
		threeGlasses.position.z=0.5;
	});		
	scene.add(threeGlasses);
}
2

What version of three.js are you using? Could you share a demo or the model?

3

Threejs>
three.js (1.2 MB)
gltfloader>
GLTFLoader.js (99.0 KB)
model>
goggles.glb (589.2 KB)

these lines are also seen https://gltf.insimo.com/ in this viewer.

4

This issue was fixed in three.js r114 (https://github.com/mrdoob/three.js/pull/18235), and you are currently using r112. Upgrading (both three.js and GLTFLoader.js) to r114+ should resolve the problem. Alternatively, traverse the model and set material.depthWrite = false on any material where material.transparent === true.

1 Like
5

thank you, it worked…

what should i do view this logo, as i could see this in https://sandbox.babylonjs.com/

dump4
dump41280×574 64.6 KB

my current progress:
dump5

6

will adding material shininess solve the issue?? if so how?

7

You probably need an environment map — see the MeshStandardMaterial documentation. Any metallic surfaces require an environment map to appear reflective.

8

hi… adding roughness gave me this result

dump6
dump6709×521 12.8 KB

but adding textures removes logo

code:

	    loader.load( './model/goggles.glb', function (glassesFramesGeometry){
    		var model = glassesFramesGeometry.scene;
    		model.traverse ( ( o ) => {
    			if ( o.isMesh ) {
    			//o.material.map = texture;
    			o.material.metalness = 1;
    			o.material.roughness = 1;
    			}
    		} );

I still couldn’t get shiniess… what property should i use to get shiniess?

9

Roughness is the opposite of glossiness, or shininess. You will need an environment map and a low roughness value for that. Changing the texture will certainly change how any model looks.