Question

好的，所以我可以完全访问一个素材，我可以在运行时更改它的颜色，但是尝试更改地图纹理会产生错误。

例如

var materials = mesh.material.materials;
materials[index].color.setHex(0xb60430);
materials[index].needsUpdate = true;
scene.render();

这完全正常，但是在同样的情况下

var materials = mesh.material.materials;
var texture = new THREE.Texture(myPreloadedImageObject);
materials[index].map = texture;
materials[index].needsUpdate = true;
scene.render();

这会抛出一个错误（如果有点奇怪我不能从node-webkit控制台复制粘贴的借口）

[.WebGLRenderingContext]GL ERROR :GL_INVALID_OPERATION : glDrawElements: attempt to access out of range vertices in attribute 1

请注意，我也可以删除这样的材料

materials[index] = 0;
scene.render();

它也不会抛出错误。

s9k来自github问题部分建议

geometry.buffersNeedUpdate = true;
geometry.uvsNeedUpdate = true;

我做了什么，现在它没有抛出错误，但它没有做任何事情......材料保持不变。再次，如果我尝试设置颜色，它可以工作，但如果我尝试设置颜色和材料，没有任何反应。

如果我在渲染后记录材质，它确实有一个地图设置为纹理，但由于某种原因它没有被渲染我想

有什么想法吗？这是一个错误吗？

Answer 1

这是在three.js框几何上的three.js r68工作纹理更改，这可能有助于您在代码中找到问题：

工作链接：http://jppresents.net/static/threetexturechange/texturechange.html

代码：

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var geometry = new THREE.BoxGeometry(3,3,3);
var texture = THREE.ImageUtils.loadTexture( "a.png" );  
var texture2 = THREE.ImageUtils.loadTexture( "b.png" ); 
var material = new THREE.MeshBasicMaterial({color: 0x00ff00, map:texture});
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);

camera.position.z = 5;
var frame = 0;

function render() {
    frame++;
    if (frame > 120) {
        material.map = texture2;
        material.needsUpdate = true;
        console.log('texture change')
    }
    if (frame > 240) {
        material.map = texture;
        material.needsUpdate = true;
        frame = 0;
        console.log('texture change')
    }

    requestAnimationFrame(render);
    cube.rotation.x += 0.01;
    cube.rotation.y += 0.01;
    renderer.render(scene, camera);
};

render();

在运行时更改three.js材质纹理会引发错误

1 个答案: