Getting cursor-geometry-intersection position using raycasting or hover

Hi everyone,

I hope someone can help me out of this rabbithole :rabbit2:

I’m currently trying to figure out how I can retrieve the position of the intersection between my cursors x and y projected to the closest geometry/node - resembling Three.js raycaster method.

Is the SelectionExtension able to return a node position? If so, what steps am I missing in order to fully enable hover?

        const cameraControls = viewerInstance.createExtension(CameraController);
        const selectionInstance =viewerInstance.createExtension(SelectionExtension);

        selectionInstance.enabled = true;
        selectionInstance.hoverMaterialData = {
          id: MathUtils.generateUUID(), 
          color: 0x047efb, 
          opacity: 1,
          roughness: 1, 
          metalness: 0, 
          vertexColors: false,
          lineWeight: 1,
          stencilOutlines: true,
          pointSize: 4, 
          depthWrite: true, 
        };

        selectionInstance.applyHover();

If not, is there a way I can implement SpeckleRaycaster? It doesn’t seem like it was intended to be imported?

I have also tried implementing Three.js own Raycaster, however I’m not sure it’s easy to adjust the the speckle data structure to three.js implementation.

Hi @Idavill

If hover effect is what you are after, you just need to tell SelectionExtension to do it via it’s options. Here is a live example that shows this. Additional information is available in the viewer’s documentation

If you are after intersecting in the scene, this is possible via the viewer’s query functionality. Here is a live example that shows how you can pick objects in the scene with the mouse. You can find additional information about queries in the viewer’s documentation

Regardless of what you are after, there is no need to implement your own raycasting mechanism, or even attempt to try three’s builtin one. The Speckle viewer uses a two level BVH for all intersection tests which is astronomically faster than three’s default geometry intersection implementation. The viewer also exposes the BVH acceleration structure directly on a per-object basis like described here as well as on a per-batch basis

Let us know if you need more help

Cheers

3 Likes

Hi Alex,

Thank you, this helped a lot! I managed to fit the implementation to my application context. It works like a dream :slight_smile:

3 Likes