Tilling textures

[adrianposteuca]

Hello all,

I am using Transform textures example for adjusting the texture for my project, but something strange happens when I touch the Scale Slider, the texture disappears ( Is even too big or too small).
I am using 256x256 px (pow) textures so it must be working properly.

What seems to be the problem?

[elalish]

Do you have a link where we can repro the problem?

[adrianposteuca]

Have a look here : https://conceptfactory.ro/avatar-fashion/

is there a way to set up Warpping mode to Repeat ?

[elalish]

Hmm, I don't see any textures at all. Look at setWrapS in Sampler: https://modelviewer.dev/examples/scenegraph/#pickMaterialExample (scroll down for the API doc)

[adrianposteuca]

Have a look at my website with these steps.

[adrianposteuca]

I can see these
enum WrapMode {
ClampToEdge = 33071,
MirroredRepeat = 33648,
Repeat = 10497,
}

but how can i use them in this context

"
const texture = await modelViewer.createTexture(imageUrl);
sampler = texture.sampler;

scaleSlider.addEventListener('input', (event) => {
    const scale = {
        u: scaleSlider.value,
        v: scaleSlider.value
    };
    sampler.setScale(scale);
    scaleDisplay.textContent = scale.u;
});"

[adrianposteuca]

Yes, and i have this error model-viewer.js:23652 WebGL: INVALID_ENUM: texParameter: invalid parameter

scaleSlider.addEventListener('input', (event) => {
const scale = {
u: scaleSlider.value,
v: scaleSlider.value
};
sampler.setWrapS(10497);
sampler.setScale(scale);
scaleDisplay.textContent = scale.u; // Changed from scale.x to scale.u as 'x' is not defined in the provided scale object
});

[adrianposteuca]

this is my entire function

This is the error model-viewer.js:23652 WebGL: INVALID_ENUM: texParameter: invalid parameter

modelViewer.addEventListener("load", () => {

 let sampler;
const createAndApplyTexture = async (channel, imageUrl) => {
	const texture = await modelViewer.createTexture(imageUrl);
	
	if (channel.includes("base") || channel.includes("metallic")) {
		material.pbrMetallicRoughness[channel].setTexture(texture);
		console.log ("pbr");
		sampler = texture.sampler;
		
	} else {
		material[channel].setTexture(texture);
		sampler = texture.sampler;
		
	}
		// Attempt to set the wrap mode using the sampler's methods
		try {
			sampler.setWrapS(10497); // Try using WebGL's GL_REPEAT directly
			sampler.setWrapT(10497); // Try using WebGL's GL_REPEAT directly
		} catch (error) {
			console.error("Error setting wrap mode:", error);
		}
};

document.querySelector("#sliderid").addEventListener("click", (event) => {
	createAndApplyTexture("baseColorTexture", event.target.dataset.imgurl);
	//console.log (id);

//const sampler = modelViewer.model.materials[id].pbrMetallicRoughness['baseColorTexture'].texture.sampler;


scaleDisplay.textContent = scaleSlider.value;
rotationDisplay.textContent = rotationSlider.value;



scaleSlider.addEventListener('input', (event) => {
    const scale = {
        u: scaleSlider.value,
        v: scaleSlider.value
    };
	
    sampler.setScale(scale);
    scaleDisplay.textContent = scale.u; // Changed from scale.x to scale.u as 'x' is not defined in the provided scale object
});

rotationSlider.addEventListener('input', (event) => {
	const rotation = rotationSlider.value;
	sampler.setRotation(rotation);
	rotationDisplay.textContent = rotation;
  });

  offsetSlider.addEventListener('input', (event) => {
	const offset = {
	  u: offsetSlider.value,
	  v: -offsetSlider.value
	};
	sampler.setOffset(offset);
  });
  


});

[elalish]

Thank you, I have a repro and this is definitely a bug. We'll have it fixed for the next release, which should be next week.

[elalish]

Fixed by #4499

[adrianposteuca]

Thank you! Do I need to add something else on this? <script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script> ?

[emirhantetik]

Hello, I apologize in advance that this is irrelevant. I need support on something. In the example you created, when you make selections for t-shirt, pants, and shoes, how do you make them work independently of each other. I am trying to do this, but my variants do not work independently of each other, when I select them in order, there is no problem, but when I go back, my model switches to defaults. For example, you have made the selections. When you want to change the t-shirt, all the other clothes change.