three.js在加载的模型上通过物料名称向物料添加边框

Question

是否可以在材料周围添加边框,如图所示,

我可以通过以下代码设置材质颜色

object.traverse( function ( child )
    {
        if ( child instanceof THREE.Mesh )
            child.material.color.setRGB (1, 0, 0);
    });

对象是我加载的3d模型,所以假设应该有一种方法来绘制边框,three.js中是否有任何选项.

根据@ shiva的评论,我用以下代码尝试了它来绘制发光效果

if(childObject.material.name=="material4046")
     {
      mesh  = new THREE.Mesh( globalGeomtry, material );
    // mesh.visible = false
    scene.add( mesh );

    console.log(mesh);

    // create a glowMesh
    var glowMesh    = new THREEx.GeometricGlowMesh(mesh);
    mesh.add(glowMesh.object3d);

            // example of customization of the default glowMesh
    var insideUniforms  = glowMesh.insideMesh.material.uniforms;
    insideUniforms.coeficient.value = 2;
    insideUniforms.power.value      = 1.4;
    insideUniforms.glowColor.value.set('red');

    var outsideUniforms = glowMesh.outsideMesh.material.uniforms;
    outsideUniforms.coeficient.value    = 2;
    outsideUniforms.power.value     = 1.4;

    outsideUniforms.glowColor.value.set('red');

     }

现在输出看起来像第二张图像,我希望这种发光效果作为该材料的边界,是否可能

Answer 1

我尝试了最好的水平,但不幸的是我无法得到它,所以我决定用线框选项来突出显示材料,

if(childObject.material.name=="material9695")
   {
    mesh    = new THREE.Mesh( globalGeomtry, material );
  // mesh.visible   = false
      scene.add( mesh );


  //console.log(mesh);

  var outlineMaterial1 = new THREE.MeshBasicMaterial( { color: 0xff0000,wireframe   : true } );
  var outlineMesh1 = new THREE.Mesh( globalGeomtry, outlineMaterial1 );

  scene.add( outlineMesh1 );


   }

现在为材料添加了线框,material9695以便我可以识别material9695当前选择的材料

这不是我预期的确切答案,但现在经过一段艰难时期后已经足够了

Answer 2

我想这就是你所追求的。它可以通过以下方式实现：

new THREE.MeshBasicMaterial( { color: 0x00ff00, side: THREE.BackSide } );

您可以在这里看到：https : //stemkoski.github.io/Three.js/Outline.html