three.js:texture.needsUpdate doesn't work

Question

I'm using image texture in three.js, and the image will change at run time. Codes like this.

var geom1 = new THREE.PlaneGeometry(50, 50);
var map1 = new THREE.ImageUtils.loadTexture('0.png');
var material = new THREE.MeshBasicMaterial({map: map1, side: THREE.DoubleSide});
var mesh1 = new THREE.Mesh(geom1, material1);
scene.add(mesh1);
renderer.render(scene, camera);
//then '0.png' changed
//...
//then following codes run, I need remove mesh1 and create a new mesh
scene.remove(mesh1);
renderer.render(scene, camera);
var geom2 = new THREE.PlaneGeometry(50, 50);
var map2 = new THREE.ImageUtils.loadTexture('0.png');
var material2 = new THREE.MeshBasicMaterial({map: map2, side: THREE.DoubleSide});
var mesh2 = new THREE.Mesh(geom2, material2);
scene.add(mesh2)
renderer.render(scene, camera);

but image texture used in mesh2 unchanged. It seems that I need use needsUpdate. I've used map2.needsUpdate = true after create map2 and in the callback function when create map2, but it doesn't work.

I'm using three.min.js r70 and Firefox 36.0.1.

As the textures have the same file name, could it be that the browser is caching the image? Just a thought. — 2pha, Mar 16 '15 at 06:40
I just tried your thought and you're right :), so how to solve it? — user2900040, Mar 16 '15 at 07:46
http://stackoverflow.com/questions/6015489/how-to-prevent-browsers-from-caching-an-image — 2pha, Mar 16 '15 at 11:09
Thanks for your answer. In fact I'm using Python's flask, so I use javascript to add a random number. — user2900040, Mar 16 '15 at 14:10

three.js:texture.needsUpdate doesn't work

0 Answers0