Fyrestar / THREE.extendMaterial

Extending built-in materials, instances of ShaderMaterial and shader objects of onBeforeCompile.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Looking for a way to use texture with extended material

RollsChris opened this issue · comments

Hi, I'm trying to use a texture for the map property with the extended class but its not working?
app.js line 95-98
Replit

Is it because your adding a default fragment shader? and its overriding it.

Thanks for any advice

You assigned it to the options block extendMaterial uses. If you want to pass material properties you do it as the cheatsheet shows

	// Properties to apply to the new THREE.ShaderMaterial
	material: {
		skinning: true
	},

However it doesn't belong in there either since the material will be a ShaderMaterial based one. You pass it in the uniforms.

      uniforms: {
        map: texture
      }

Wow thanks just noticed you fixed it :) where is the cheat sheet sorry? and its not showing the way I want, is this because I still need to make a fragment shader with the uvs?

Thanks

from Bruno Simon if you have heard of him :)
image

he likes your library

Your geometry needs correct uvs yes but no shader adapations or anything since it's a full MeshStandardMaterial, i don't know exactly what you all do there but it looks like it's missing uvs.

Seems to work better using SphereGeometry instead of IcosahedronGeometry... not sure why the uvs would be diffrent

@Fyrestar do you have that cheat sheet please?

Ah ok, I thought there was somthing else.

Sorry me again ;) I don't think the textures properties are being copied over to the extended material?

None of these settings are working?

texture.wrapS = THREE.RepeatWrapping
texture.wrapT = THREE.RepeatWrapping
texture.repeat.x = 90
texture.repeat.y = 3

I'm thinking they should be

I'm trying to understand the code in this library and just curious to why you lump overridable properties in the uniform? I think you check the passed in uniforms and if the property exists on the source then you set it... why not have another property on the object passed in called overrides or something like that?

Not sure what you're doing in your code but that's not related to this lib and does work. However since some textures are required to be also present on the material as property as they would be on a built-in material class, if you changed a in-built texture uniform with a different you also need to assign it to the material again, such as:

material.map = material.uniforms.map.value = otherTexture;

This is since three for the default materials expects them to be present there.

This is also why the textures you use should be assigned in the extendMaterial call in the uniforms so it assigns them already. The new version i didn't released yet also has an updateMaps method that will do the assignment for all automatically. It could be also done with a getter and setter on the custom material class, but it's extra steps in a render loop i wanted to avoid, and it might not work with THREE detecting if a certain map is used (as undefined), which is done to reduce shader code.

Hey these properties are set on the texture before i set it on the extendedMaterial:
image
I then just pass texture to extendedMaterial in uniforms:
image
without using extendedMaterial everything works as expected...

The wrapping is setup for textures as usually, however repeat is not, it's a built-in mechanism that is passed to uvTransform uniform. This is a bit of concept issue in Three since there can be only one texture transform for offset, repeat and rotate.

By assigning it to the material itself Three should setup this for you, if it doesn't you can also:

material.uniforms.uvTransform.value.elements[0] = 2;
material.uniforms.uvTransform.value.elements[4] = 2;

Asides of this you could also test if updateMatrix calling on texture.updateMatrix() after you set the repeat fixes your issue.

I'll look into if and why Three does not handle it if it's the case, but would rather add a different standard that is easier to deal with, such as adding it to the CustomMaterial or methods like material.setRepeat( 2, 2 ) since there is always just one valid uvTransform anyway.