CODEWITHSUNDEEP
three.js
Jack G
Jack G

Reputation: 107

Create wireframe of model in threes.js GLTFloader

I want to load a 3D model and create the wireframe in threejs. How may I achieve this effect? Thank you very much.

This is the code I have for now, but it doesn't work.

var loader = new THREE.GLTFLoader();
loader.load('name.gltf', function(geometry, materials) {
    var material = new THREE.MeshLambertMaterial();
    var mesh = new THREE.Mesh(geometry, material);
    group = new THREE.Object3D();
    group.add(mesh); 
    scene.add(group); 
});

Upvotes: 2

Views: 3415

Answers (2)

Don McCurdy
Don McCurdy

Reputation: 11980

According to the GLTFLoader docs, the callback's argument is an object with a .scene property containing your model. Like any nested three.js object, you can modify materials using .traverse().

var loader = new THREE.GLTFLoader();
loader.load('name.gltf', function(gltf) {
    var object = gltf.scene;
    object.traverse((node) => {
      if (!node.isMesh) return;
      node.material.wireframe = true;
    });
    scene.add(object);
});

Upvotes: 5

manthrax
manthrax

Reputation: 5036

var material = new THREE.MeshLambertMaterial({wireframe:true});

Upvotes: -2

Related Questions