Question

我从MeshBasicMaterial切换到ShaderMaterial，以便为我的网格纹理提供过滤器。 ShaderMaterial继承自Material，因此存在opacity参数。但是更改此参数不会改变对象的不透明度。我正在使用THREE.HueSaturationShader，它没有设置alpha值。

我添加了一个非常简单的小提示来展示情况 http://jsfiddle.net/thenectorgod/89aahytL/1/

// BufferGeometry Tester

var hostDiv, scene, renderer, camera;

var WIDTH = 500;//window.innerWidth,
HEIGHT = 500;//window.innerHeight,
FOV = 35,
NEAR = 1,
FAR = 1000;

function init() {
hostDiv = document.createElement('div');
document.body.appendChild(hostDiv);

scene = new THREE.Scene();

renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(WIDTH, HEIGHT);
renderer.setClearColor( 0x888888, 1 );
hostDiv.appendChild(renderer.domElement);

camera = new THREE.PerspectiveCamera(FOV, WIDTH / HEIGHT, NEAR, FAR);
camera.position.z = 50;
camera.lookAt(scene.position);
var geometry = new THREE.PlaneBufferGeometry(20,20);
var material = new THREE.ShaderMaterial({
  transparent: true,
  depthTest: false
});
material.opacity = 0;
var mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
scene.add(camera);
animate();
}

function render() {
renderer.render(scene, camera);
}

function animate() {
requestAnimationFrame(animate);
render();
}

init();

虽然我将不透明度设置为0，但对象仍然可见。

如何在不添加额外不透明度参数的情况下同时使用不透明度和着色器。

Answer 1

您的着色器材质没有着色器。默认情况下，它呈现类似MeshBasicMaterial的内容，但硬编码的GLSL颜色为红色，没有透明度/不透明度。

如果你想要一个ShaderMaterial，你实际上需要为它编写GLSL着色器。

THREE.ShaderMaterial不透明度不起作用

1 个答案: