美文网首页
给渲染对象加描边

给渲染对象加描边

作者: 不决书 | 来源:发表于2019-10-15 16:56 被阅读0次

    关键的实现思路就是将渲染模式设置为BackSide,然后将图形放大,看上去就是我们要实现的描边

    1550475702080-301de951-cba0-4545-8973-ee62a5b1290d.png

    https://stemkoski.github.io/Three.js/Outline.html

     var outlineMaterial1 = new THREE.MeshBasicMaterial( { color: 0xff0000, side: THREE.BackSide } );
     
     var outlineMesh1 = new THREE.Mesh( sphereGeometry, outlineMaterial1 );
     
     outlineMesh1.position = sphere.position;
     
     outlineMesh1.scale.multiplyScalar(1.05);
     
     scene.add( outlineMesh1 );
     
     var cubeGeometry = new THREE.CubeGeometry( 80, 80, 80 );
     
     var cube = new THREE.Mesh( cubeGeometry, material );
     
     cube.position.set(60, 60, 0);
     
     scene.add( cube );  
     
     var outlineMaterial2 = new THREE.MeshBasicMaterial( { color: 0x00ff00, side: THREE.BackSide } );
     
     var outlineMesh2 = new THREE.Mesh( cubeGeometry, outlineMaterial2 );
     
     outlineMesh2.position = cube.position;
     
     outlineMesh2.scale.multiplyScalar(1.05);
     
     scene.add( outlineMesh2 );
    
    

    相关文章

      网友评论

          本文标题:给渲染对象加描边

          本文链接:https://www.haomeiwen.com/subject/qwrsuctx.html