Three.js change texture or color when clicking on button

Question

My jQuery:

<script type="text/javascript">
$(document).ready(function(){

$("#button").click(function(){
cube[0].mesh.material.uniforms.texture.value = THREE.ImageUtils.loadTexture("textures/envmap.png");
cube[0].mesh.material.uniforms.texture.needsUpdate = true;
});

});
</script>

I have an array of cubes, and I want to be able to change the texture of the cube when clicking on the #button div.

I get this error in chrome when clicking on the div:

Uncaught TypeError: Cannot read property 'material' of undefined

How is it possible to change the texture or color for cube[0] that is a THREE.CubeGeometry object.

I have a JS fiddle here: http://jsfiddle.net/SCXNQ/559/

frank · Accepted Answer · 2013-03-09 11:34:38Z

2

Follow this example: http://mrdoob.github.com/three.js/examples/webgl_materials_cars.html

Use console.log to debug your app, you are trying to access non-existent objects such as cube[0], or cube.mesh. You get the material by using cube.material. There are no uniforms array because you are using a MeshBasicMaterial.

Thee needsUpdate=true should be triggered in a texture's onload listener.

answered Mar 9, 2013 at 11:34

frank

4774 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rails beginner Over a year ago

can you create a simple example with a cube?

Rails beginner Over a year ago

Can you create a simple example with textures, just as I created with colors_

aug Over a year ago

@Railsbeginner Three.js updated so your example didn't work anymore so I went and put a fix: jsfiddle.net/SCXNQ/1007

Collectives™ on Stack Overflow

Three.js change texture or color when clicking on button

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related