как переключить текстуру цели рендера в три js? - PullRequest
Новая
       6

как переключить текстуру цели рендера в три js?

0 голосов
/ 05 января 2019

Мне нужно выполнить некоторые расчеты на основе текстуры.

У меня есть две текстуры: текущая текстура и следующая текстура. Содержание следующей текстуры зависит от текущей текстуры.

Вот процедура моей программы

  1. Инициализация текущей текстуры и следующей текстуры 

    let array = new Float32Array(3 * amount);
array = init(array);
currentTexture= new THREE.DataTexture(array ,
    textureSize, textureSize,
    THREE.RGBFormat, THREE.FloatType);

let textureOptions = {
    format: THREE.RGBAFormat,
    type: THREE.FloatType
};
nextTexture= new THREE.WebGLRenderTarget(textureSize, textureSize, textureOptions);

  2. рендер к следующей текстуре и замена текущей текстуры и следующей текстуры для следующего рендера 

    renderer.render(scene, camera, nextTexture);
let temp = mesh.material.uniforms.currentTexture.value;
mesh.material.uniforms.currentTexture.value = nextTexture.texture;
mesh.material.needsUpdate = true;
nextTexture.texture = temp;

Но моя программа не работает, консоль браузера заполнена GL ERROR :GL_INVALID_OPERATION : glDrawArrays: Source and destination textures of the draw are the same. Я думаю, это потому, что текущая текстура и следующая текстура не поменялись местами.

Как я могу это исправить? Спасибо

1 Ответ

0 голосов
/ 05 января 2019

Вы не можете изменить поле texture цели рендера, поэтому вам понадобятся две текстуры рендеринга и использовать одну в качестве цели рендеринга, а другую - в качестве текстуры сетки. Вам нужно будет заполнить исходную цель рендеринга данными такими способами, как рендеринг полноэкранного четырехугольника в цель рендеринга.

Вот пример того, как может выглядеть инициализация: 

let array = new Float32Array(3 * amount);
array = init(array);

let dataTex = new THREE.DataTexture(array,
    textureSize, textureSize,
    THREE.RGBFormat, THREE.FloatType);

// Create the textures to swap
let textureOptions = {
    format: THREE.RGBAFormat,
    type: THREE.FloatType
};
let currentTexture = new THREE.WebGLRenderTarget(textureSize, textureSize, textureOptions);
let nextTexture = new THREE.WebGLRenderTarget(textureSize, textureSize, textureOptions);

// material with shader to render next frame based on the current texture
const material = /* custom material */; 

// ... init the current texture by rendering a quad with the data texture to seed the texture

И затем рендеринг текстур перед их заменой: 

// render the animation step
material.uniforms.currentTexture.value = currentTexture.texture;
renderer.render(scene, camera, nextTexture);

// swap the textures
let temp = currentTexture;
currentTexture = nextTexture;
nextTexture = temp;

Надеюсь, это поможет!

...