DataTexture Threejs не обновляется

ОБНОВЛЕНИЕ: проблема заключалась в том, что объект texData воссоздавался каждый раз, и поэтому ссылка на DataTexture была потеряна. Решение WestLangley состояло в том, чтобы перезаписать данные в texData вместо воссоздания объекта texData.

У меня есть простая сцена trijs с DataTexture в ShaderMaterial, Массив данных, переданный ему один раз во время инициализации, обновляется при событиях мыши. Однако DataTexture, похоже, не обновляется.

Я назначил униформу или данные текстуры неправильно? Или используя needsUpdate флаги неправильно? Он работает при удалении и воссоздании объектов текстуры, материала, сетки и сцены каждый раз, но это не должно быть действительно необходимым, как я видел из многих примеров, которые я, однако, не мог воспроизвести.

Обратите внимание, что сами данные обновляются красиво, но не DataTexture.

// mouse event triggers request to server
// server then replies and this code here is called
// NOTE: this code **is** indeed called on every mouse update!

// this is the updated data from the msg received
// NOTE: texData **does** contain the correct updated data on each event
texData = new Float32Array(evt.data.slice(0, msgByteLength));

// init should happen only once
if (!drawContextInitialized) {

    // init data texture
    dataTexture = new THREE.DataTexture(texData, texWidth, texHeight, THREE.LuminanceFormat, THREE.FloatType);
    dataTexture.needsUpdate = true;

    // shader material
    material = new THREE.ShaderMaterial({
        vertexShader: document.querySelector('#vertexShader').textContent.trim(),
        fragmentShader: document.querySelector('#fragmentShader').textContent.trim(),
        uniforms: {
            dataTexture: { value: dataTexture }
        }
    });

    // mesh with quad geometry and material
    geometry = new THREE.PlaneGeometry(width, height, 1, 1);
    mesh = new THREE.Mesh(geometry, material);

    // scene
    scene = new THREE.Scene();
    scene.add(mesh);

    // camera + renderer setup
    // [...]

    drawContextInitialized = true;

}

// these lines seem to have no effect
dataTexture.needsUpdate = true;    
material.needsUpdate = true;
mesh.needsUpdate = true;
scene.needsUpdate = true;

renderer.render(scene, camera);

2 ответа

Решение

При обновлении DataTexture данные, не создавайте новый массив. Вместо этого обновите элементы массива следующим образом:

texData.set( javascript_array );

Кроме того, единственный флаг, который необходимо установить при обновлении данных текстуры:

dataTexture.needsUpdate = true;

three.js r.83

По какой-то причине мне было очень тяжело видеть какие-либо изменения в модификациях. В отчаянии я только что сделал новую DataTexture . Это важно, чтобы установить needsUpdate в true

imgData.set(updatedData)
var newDataTex = new THREE.DataTexture( imgData,...     
var newDataTex.needsUpdate = true

renderMesh.material.uniforms.texture.value = newDataTex
Другие вопросы по тегам