显示线框的单面 - three.js

时间:2017-11-25 14:11:10

标签: three.js

three.js材质具有side属性,该属性控制是否渲染网格的正面和/或背面。有没有办法用线框做同样的事情,以便只渲染前面的边?

显示多维数据集的背面:

  var geo = new THREE.EdgesGeometry( mesh.geometry );
  var mat = new THREE.LineBasicMaterial( { 
    color: 0x000000, 
    linewidth: 4,
    side: THREE.FrontSide
  } );
  var wireframe = new THREE.LineSegments( geo, mat );
  mesh.add( wireframe );

  wireframe.renderOrder = 1;

enter image description here https://jsfiddle.net/8p7jja9L/34/

尝试显示线框前端:

{{1}}

enter image description here https://jsfiddle.net/8p7jja9L/35/

1 个答案:

答案 0 :(得分:1)

如果我理解正确,您只需将wireframe: true添加到素材中并指定要渲染的一面:

https://jsfiddle.net/8p7jja9L/39/

  material = new THREE.MeshPhongMaterial({
    color: 0xFF9800, 
    side: THREE.FrontSide,
    wireframe: true <---
  });

这将为three.js'框几何体渲染线框的单面。如果这不是你想象的线框,你可能需要用平面构造一个盒子或使用像搅拌器这样的工具来创建你想要的线框。