Changing shaderMaterial texture

Questions
, ,
1

Hello guys,

I had a plane in my scene has a shaderMaterial, i’m trying to change the texture but the problem here is when i select a new texture my plane change to black …

I have recreate this simple scene here for the demo, choose a new texture from a select option.

This is the link
Note please: you can refresh the frame if you find the scene white.Tx

2

Hi!

  onChange() {
    this.selectOptions.addEventListener("change", (e) => {
      let loader = new THREE.TextureLoader();
      let target = e.target.value;
      let newTexture = loader.load(`src/images/img${target}.jpg`);
      this.material.uniforms.textureImg.value = newTexture;
      this.material.uniforms.textureImg.value.needsUpdate = true;
    });
  }
  1. ImageLoader => TextureLoader
  2. image => images, plus src/ at the start of the path
  3. after setting a new value to a uniform, update just that uniform and not a material awhole

Moreover, you don’t need this part:

      extensions: {
        derivatives: "#extension GL_OES_standard_derivatives: enable"
      },
2 Likes
3

Thanks man!