Raycasting to buffergeometry failed

Questions
,
1

I have these 2 events that are fired, The objects I am targetting are BufferGeometry but its not returning any intersections. The objects in the intersections array are groups, if I change this to check for my meshes it throws an error. Does anyone know what might be causing this to happen?

image
image834×205 9.89 KB 

export class Raycaster extends THREE.Raycaster {
    mouse: THREE.Vector2 = new THREE.Vector2();

    constructor(camera: THREE.PerspectiveCamera, renderer: Renderer) {
        super();

        fromEvent(renderer.domElement, 'mousemove').subscribe((event: MouseEvent) => {
            const canvasBounds = renderer.domElement.getBoundingClientRect();
            this.mouse.x = ((event.clientX - canvasBounds.left) / (canvasBounds.right - canvasBounds.left)) * 2 - 1;
            this.mouse.y = - ((event.clientY - canvasBounds.top) / (canvasBounds.bottom - canvasBounds.top)) * 2 + 1;
        });

        const click = fromEvent(renderer.domElement, 'click');
        click.subscribe((event: MouseEvent) => {
            this.setFromCamera(this.mouse, camera);

            let arr = [];
            DataController.scene.children[0].children[0].traverse((mesh) => {
                if (mesh.type === "Mesh") {
                    arr.push(mesh);
                }
            });

            const intersections = this.intersectObjects(arr);

            if (intersections.length > 0) {
                ((intersections[0].object as THREE.Mesh).material as MeshStandardMaterial).color.set(0xFF0000);
            }
        });
    }
}
2

Can you please verify if the geometry actually has data? If Cannot read property '0' of null is reported in BufferAttribute.getX(), it means that the array property of the buffer attribute is null.

3

I can see the geometry in the scene, so it should exist. I have made an output of the first element in the array that is passed for intersection checking in case you see anything thats wrong.

image
image835×391 17.9 KB

4

Well, the array property of all attributes is null.

image

The geometry can still be rendered if the respective WebGL buffers already exist. Sometimes devs clear the array property after the first upload in order to save some memory. The following example also uses this approach:

https://threejs.org/examples/webgl_buffergeometry

5

I see, I will need to check the source code that generates the attributes to be sure they are filled. I will keep you updated once I find the relevant code.

6

Looking in the source code of the package I found this. Seems like he actually did do it to save on memory!

    function disposeArray() {
        this.array = null;
    }

    three_geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( positions, 3 ).onUpload( disposeArray ) );
    three_geometry.setAttribute( 'normal', new THREE.Float32BufferAttribute( normals, 3 ).onUpload( disposeArray ) );
    three_geometry.setAttribute( 'uv', new THREE.Float32BufferAttribute( uvs, 2 ).onUpload( disposeArray ) );
1 Like