Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Errors and issues when using multiple extended materials #21

Open
callumacrae opened this issue Mar 9, 2023 · 0 comments
Open

Errors and issues when using multiple extended materials #21

callumacrae opened this issue Mar 9, 2023 · 0 comments

Comments

@callumacrae
Copy link

I don't know if this is a bug in the code or documentation as I found a workaround, but figured I'd open an issue:

I'm getting an error when using three-extend-material more than once on the same page. In this case, they're also associated with separate contexts, but after looking through the code I'm not sure that'd make a difference.

My first material:

const floorMaterial = extendMaterial(THREE.MeshPhongMaterial, {
  class: THREE.ShaderMaterial,

  header: glsl`...`,
  vertexHeader: glsl`...`,
  vertex: {
    '#include <worldpos_vertex>': glsl`...`,
  },
  fragment: {
    '#include <lights_fragment_begin>': glsl`...`,
  },

  uniforms: {
    diffuse: {
      shared: true,
      value: new THREE.Color(0x999999),
    },

    uMirrors: {
      shared: true,
      value: [],
    },
  },
});

My second material:

  helloMesh.material = extendMaterial(THREE.MeshPhongMaterial, {
    class: THREE.ShaderMaterial,

    vertexHeader: glsl`...`,
    vertex: {
      'void main() {': glsl`...`,
      '#include <beginnormal_vertex>': glsl`...`,
      transformEnd: glsl`...`,
    },

    material: { side: THREE.DoubleSide },

    uniforms: {
      uTime: {
        mixed: true,
        linked: true,
        value: 0,
      },
      diffuse: {
        value: new THREE.Color(0xefd152),
      },
    },
  });

Then, I get some weird issues. Steps to replicate:

  • I'm adding both materials to their own scenes + contexts and adding them to the document, but not yet animating them - just initialising them to the first frame of the animation.
  • I start the animation for the scene containing the first material and get the following error:

image

  • I stop the animation for the first scene
  • Then, I start the animation for the second scene. It works fine and there's no problems
  • I stop the animation for the second scene
  • I start the animation for the first scene. I get the same error
  • I stop the animation for the first scene
  • I start the animation for the second scene

This is where stuff gets really broken - suddenly, the diffuse value for the second material has become equal to the colour for one of the lights in the first scene. Setting the colour was done on initialisation and hasn't been changed since then, and definitely not since it worked the first time.

Setting explicit: false on the material fixes the issue, so I assume the problem must lie in useUniforms somewhere - but I can't figure out where specifically so am unable to contribute an actual fix :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant