对目标对象的轮廓效果

Question

我正在寻找一种设置对象轮廓的方法。

我使用的是“ OutlineEffect”而不是“ EffectComposer”（OutlinePass等），因为当我使用效果作曲器时，即使使用FXAAShader，分辨率质量也很低，SSAA Shader和OutlinePass不能使用“深色”。

关于OutlineEffect，它说：

/*
 * 1. Traditional
 *
 * var effect = new THREE.OutlineEffect( renderer );
 *
 * function render() {
 *
 *  effect.render( scene, camera );
 *
 * }
*/

而且当我使用它的时候，甚至Skybox都会得到轮廓。

var outlinePass;
function init()
{
    ...
    outlinePass = new THREE.OutlineEffect(renderer);
    ...
}

function animate()
{
   ...
   outlinePass.render(scene, camera);
   ...
}

问题是我不想让它在Skybox上绘制轮廓。

所以我用了effect.setRenderTarget(objects)的outlinePass = new THREE.OutlineEffect(renderer);底行，并且发生了错误：

three.js:18819 Uncaught TypeError: Invalid value used as weak map key
    at WeakMap.set (<anonymous>)
    at Object.get (three.js:18819)
    at WebGLTextures.setupRenderTarget (three.js:22177)
    at WebGLRenderer.setRenderTarget (three.js:25956)
    at THREE.OutlineEffect.setRenderTarget (OutlineEffect.js:563)

我想做的是为没有天空盒的选定对象创建'黑色'轮廓。

谢谢您的帮助！

Answer 1

没有轮廓，另一个用于具有轮廓。

让我们为没有轮廓对象的创建子场景。

skyBox = {
    scene: new THREE.Scene(),
    camera: new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 20000 )
//camera has same properties with main camera.
};

现在没有轮廓的对象应该在skyBox.scene中添加，并且skyBox.camera将显示它们。

对于对象，我需要添加以下对象：
skyBox.scene.add(object);

并且我从主摄像机复制了副摄像机的其他控件（例如，轨道控件，...），所以我会觉得只有'1'摄像机。

所以现在，我需要让副摄像机与主摄像机具有相同的条件。
//controls for camera control; e.g. orbit control.

controls = new THREE.OrbitControls( camera, renderer.domElement );
controls.addEventListener('change', camRender2 );  // for controls2
...
controls2 = new THREE.OrbitControls( skyBox.camera, renderer.domElement );
controls2.addEventListener('change', camRender );  // for control
... // other condition for your own controls.

现在，设置完成。我只需要添加OutlineEffect

outlineEffect = new THREE.OutlineEffect(renderer);

现在，我只需要渲染它。

...
renderer.autoClear = false;   // If miss it, only main camera will render.
...
function render()
{
    //let sub camerafollow the main camera.
    skyBox.camera.quaternion = camera.quaternion;

    outlineEffect.render(scene, camera);           //render for outline scene.
    renderer.render(skyBox.scene, skyBox.camera);  //render for without outline scene.
}

添加轮廓对象，只需要scene.add(object);。

不要忘记！您需要使用摄像机和场景控制对象，添加，附加对象的位置。
（（像悬停事件，单击事件一样，您需要使用场景进行光线广播，其中包括对象。）