Closed
Description
For example, if a Sprite's center is set to (0, 0.5) and the sprite moves towards the left edge of the camera frustum, it will disappear as soon as less than ~ 30% of the sprites remain.
Simple code example:
const renderer = new THREE.WebGLRenderer();
renderer.setSize(400, 300);
document.body.append(renderer.domElement);
const scene = new THREE.Scene();
const sprite = new THREE.Sprite(new THREE.SpriteMaterial());
sprite.scale.set(100, 100, 1);
sprite.center = new THREE.Vector2(0, 0.5);
scene.add(sprite);
const camera = new THREE.OrthographicCamera(-200, 200, 150, -150, 0.1, 1000);
//const camera = new THREE.PerspectiveCamera(50, 4/3, 0.1, 1000);
camera.position.z = 500;
const rerender = () => {
renderer.render(scene, camera);
}
rerender();
window.addEventListener('keydown', e => {
if(e.key === 'ArrowLeft') sprite.position.x -= 10;
if(e.key === 'ArrowRight') sprite.position.x += 10;
rerender();
})
After some code-digging, I found that the problem seems to be Frustum's .intersectsSprite method, which ignores the Sprite's .center property entirely.
Seems like replacing _sphere.center.set( 0, 0, 0 ) with _sphere.center.set( 0.5 - sprite.center.x, 0.5 - sprite.center.y, 0 ) would fix the issue?