EffectComposer在Three.js中不允许不透明度

时间:2016-06-27 01:19:21

标签: three.js

如何让EffectComposer不要杀死背景不透明度?

我找到了帖子How do I stop EffectComposer from destroying my transparent background?,但我没有成功。

// create a camera, which defines where we're looking at.
var camera = new THREE.OrthographicCamera(-window.innerWidth, window.innerWidth, window.innerHeight, -window.innerHeight, -10000, 10000);

scene.add(camera);

// create a render and set the size
var parameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat, stencilBuffer: false };
var renderTarget = new THREE.WebGLRenderTarget(
  window.innerWidth, window.innerWidth, parameters );

var renderer = new THREE.WebGLRenderer( { alpha: true } );

renderer.setClearColor(new THREE.Color(0xFFFFFF, 0));
renderer.setSize(window.innerWidth, window.innerHeight);

var planeGeometry = new THREE.PlaneGeometry(0, 0);
var planeMaterial = new THREE.MeshBasicMaterial({color: 0x000000,
                                                depthTest: false });
var plane = new THREE.Mesh(planeGeometry, planeMaterial);
//plane.position.z = -100;
plane.scale.set(1000, 1000, 1, 1);
// add the plane to the scene
scene.add(plane);

document.getElementById("WebGL-output").appendChild(renderer.domElement);
var renderPass = new THREE.RenderPass(scene, camera);
var effectFilm = new THREE.FilmPass(0.8, 0.325, 256, false);
effectFilm.renderToScreen = true;

var composer = new THREE.EffectComposer(renderer, renderTarget);
composer.addPass(renderPass);
composer.addPass(effectFilm);

1 个答案:

答案 0 :(得分:1)

确保正确设置清晰的颜色。

renderer.setClearColor( 0x000000, 0 );

three.js r.78