Question

我正在尝试使用click事件更改已在场景中创建的球体的纹理。在场景中我还有其他元素，如text和collada object。

我所拥有的代码会改变球体的纹理，但是它会改变场景中元素的顺序，导致其他可见对象隐藏在球体后面。如果我改变球体的不透明度，我可以清楚地看到超出它的其他元素。

当我更改纹理时，如何保留场景中元素的顺序？

$("#button").click(function(){
    var textureLoader = new THREE.TextureLoader(manager);
    var materials = [
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.left), transparent: true, opacity: 1}), // right
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.right), transparent: true, opacity: 1}), // left
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.top), transparent: true, opacity: 1}), // top
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.bottom), transparent: true, opacity: 1}), // bottom
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.back), transparent: true, opacity: 1}), // back
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.front), transparent: true, opacity: 1})  // front
    ];

    mesh.material = new THREE.MultiMaterial(materials);
});

球形：

var mesh;
var geometry;
var scene = new THREE.Scene();

function init() {
    geometry = new THREE.SphereBufferGeometry(500, 60, 40);
    geometry.scale(-1, 1, 1);

    var textureLoader = new THREE.TextureLoader(manager);
    var materials = [
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.left)}), // right
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.right)}), // left
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.top)}), // top
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.bottom)}), // bottom
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.back)}), // back
        new THREE.MeshBasicMaterial({map: textureLoader.load(options.cubic.file.front)})  // front
    ];
    mesh = new THREE.Mesh(new THREE.BoxGeometry(1000, 1000, 1000, 7, 7, 7), new THREE.MultiMaterial(materials));
    mesh.scale.x = -1;
    scene.add(mesh);
}

Answer 1

I assume it could be because of the way how the renderer sorts objects that have some degree of transparency.

try setting the renderer.sortObjects = false // default is true ///

单击时更改纹理会导致其他对象隐藏

1 个答案: