Before 91 version of Three.js I was using this hack for same texture atlas for many sprite and set different uv’s
var tex = map.clone(); tex.uuid = map.uuid; tex.wrapT = tex.wrapS = THREE.RepeatWrapping; tex.offset.x = res.x1; tex.offset.y = 1.0 - res.y2; tex.repeat.set(res.x2 - res.x1, res.y2 - res.y1); tex.needsUpdate = true;
In 91 versions, WeakMap began to be used and this hack no longer works.
Now, each sprite loads the same texture as many times as many sprites and memory consumption has grown tremendously.
Further in the sprite mechanism added a UV map, but I cannot understand how to use it when I have a texture atlas and different coordinates for different sprites.
If I try set
var quad_uvs = [res.x1, 1.0 - res.y2, res.x2, 1.0 - res.y2, res.x2, 1.0 - res.y1, res.x1, 1.0 - res.y1]; var uvs = new Float32Array(quad_uvs); meshIcon.geometry.addAttribute('uv', new THREE.BufferAttribute(uvs, 2));
this works but all sprites show the same part of texture.
I looked at the code of the sprite and there the geometry was moved outside of the constructor and the feeling is that the same is used in the end in all the sprites. The same geometry for all Sprites it’s ok for me but the same interleaved buffer contain also uv mapping and when I set values I think all sprites shared also UV’s. Maybe I’m wrong.
For now I’m recreate all geometry for each sprite with different uv and it works.
But I think it’s not a right way.
Please tell me which code now correct for sprites with same texture atlas and different UV’s.