как использовать текстуру изображения с THREE.ShaderLib ['phong'] - PullRequest
Новая
       39

как использовать текстуру изображения с THREE.ShaderLib ['phong']

0 голосов
/ 19 декабря 2018

Я учусь с демо https://github.com/mrdoob/three.js/blob/master/examples/webgl_gpgpu_water.html.

Я хочу добавить фоновое изображение для этой демонстрации. 

let material = new THREE.ShaderMaterial( {
          uniforms: THREE.UniformsUtils.merge( [
            THREE.ShaderLib[ 'phong' ].uniforms,
            {
              heightmap: { value: null },
              texture: {value: new THREE.TextureLoader().load(this.bg) }
            }
          ] ),
          vertexShader: document.getElementById( 'waterVertexShader' ).textContent,
          fragmentShader: THREE.ShaderChunk[ 'meshphong_frag' ]

        } );

Но это не сработало.

И я создаю новую демонстрацию. 

let shaderMaterial = new THREE.ShaderMaterial({
            uniforms: {
              texture: {value: new THREE.TextureLoader().load(this.bg)}
            },
            vertexShader: document.getElementById('vertexshader').textContent,
            fragmentShader: document.getElementById('fragmentshader').textContent
        });

Работает.

Как это может работать и почему?Надеюсь, вы можете помочь мне, спасибо!

...