How do I access a Materials Textures via typescript

🌵 Needle Engine
1

I feel pretty dumb. I want to download a jpg from another source and apply this to an existing meshrenderers material but there are not variables for that in the Material type.

Original Post on Discord

by user 334342083445784576

2

Hey :wave: i think you can access any prop in the Material with mat["property name"].

While if you want to use a typed solution and you can retype the material to the one that is being used. You can see the type by just printing out the object.

console.log(material) which will most probably reveal it is a MeshStandardMaterial, but it’s better to double check.

So then you can do mat as MeshStandardMaterial and use it acordingly.

This standard material has normal properties to set color, colorMap, normalMap etc.

Loading textures from a file is described here:
https://threejs.org/docs/#api/en/loaders/TextureLoader

3

.
.
Both the **Material **and **MeshStandardMaterial ** classes are from Three.js

So a good way how to figure out this on your own is to double check from where the type is and potentially search for how is it done in pure three.js :+1:

4

Also to note, i had to invert the Y axis and set encoding before it worked for me. I have a bit different setup, so perhaps the encoding is the only thing you are interested in.

const tex = this.textures[index];

tex.encoding = sRGBEncoding;
tex.repeat = new Vector2(1, -1);

material[this.propertyName] = tex;
5

Thanks a lot for the detailed explanation!

by user 334342083445784576