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

[WIP] per channel uv transform example #14174

Closed
wants to merge 4 commits into from

Conversation

pailhead
Copy link
Contributor

@pailhead pailhead commented May 30, 2018

I mustered up a quick example to override the vUv value in the shaders.

http://dusanbosnjak.com/test/webGL/three-materials-extended/webgl_materials_extended_multiple_uvs_props.html

I used roughnessMap, specularMap, metalnessMap and map and added a simple scale + offset to each.

It's not the cleanest thing but it's an example of how to quickly prototype something without affecting the core.

#14149
#12788
#12608
#13831
#8278
#5876

It's easy to also expose these, but for some reason i think onBeforeCompile fired twice. I actually tried to mimick onAfterParse because onBeforeCompile is also onBeforeParse.

This is another example of using shader injection, specifically with the currently available onBeforeCompile. I think it's trivial to solve issues such as the ones linked with this kind of an api. However, i think there are better alternatives to it:

#13198

I think that this is a valid use case to find itself in the core, (transforms probably don't belong on textures, rather texture slots) but since it's a complicated process to propose and review something like that, onBeforeCompile allows for quick prototyping.

In this particular case, it mimicked a script that one could write to replace some code over many files, rather than doing it manually. For production it's a bit clunky, that's where i'd propose an alternative. Even if this weren't in the core, i think the area of GLSL is so self contained that this would be an easy effect to carry across and combine with other shader modifications.

@pailhead
Copy link
Contributor Author

v3 copies the transform matrix logic, i also moved the uniform creation to be synchronous.

http://dusanbosnjak.com/test/webGL/three-materials-extended/webgl_materials_extended_multiple_uvs_props_transform.html

This was referenced May 30, 2018
@WestLangley
Copy link
Collaborator

It took me awhile to step through this example, but it does show one way to use onBeforeCompile() to support different transforms per material texture.

I understand this to be a feasibility study. We would not expect users to do this, obviously.

@pailhead
Copy link
Contributor Author

pailhead commented May 30, 2018

Why not if it is encapsulated somehow?

The user only sees this:

myMaterial.specularMap       //Texture
myMaterial.specularMapOffset //Vector2
myMaterial.specularMapRepeat //Vector2
myMaterial.specularMapRotate //Number
myMaterial.specularMapUpdateMatrix // function

Maybe

myMaterial.specularMap
myMaterial.specularMapTransform = {
  offset,
  repeat,
  rotate,
  update,
}

Advanced user sees example how to make this ^

@mrdoob
Copy link
Owner

mrdoob commented Jun 20, 2018

#14245 (comment)

@VrTech
Copy link

VrTech commented Sep 3, 2020

@pailhead
Can it also work with a normal map? I really struggle with this.

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

Successfully merging this pull request may close these issues.

None yet

4 participants