Skip to main content

Interactivity

Event Management

luma.gl does not include any APIs for capturing events generated by user interaction (mouse clicks, pointer moves, key presses etc). The browser offers APIs for this, and another option is to a library or framework for event management. One option is use to use luma.gl's companion mjolnir.js framework, which additionally includes portable support for "gestures" on mobile phones.

Picking and Highlighting

Allowing he user to picking object from the screen is a key capability for most interactive applications. It is also often desirable to be able to highlight specific objects.

About GPU picking

GPU based picking has a couple of significant advantage over CPU-based picking:

  • GPU-based picking is a picking technique that can be performed entirely on the GPU, meaning that it is very performant, especially when picking is done every frame.

  • can be added to any existing shaders

  • and is independent of the structure of the input geometry or rendering without requiring any additional picking logic to that shader, beyond calling one function in the vertex shader and one function in the fragment shader.

Note that GPU-based picking does comes with some limitations:

  • Picking occluding objects require re-rendering and discarding the already picked objects.
  • On WebGL-specific: the read back of the picking data from the picking texture can only be done synchronously, causing a GPU pipeline stall, which can defeat some of the performance advantages.

About CPU picking

Traditional 3d frameworks often support CPU-based picking, perhaps using a JavaScript Ray class that can be intersected with a standard JavaScript-format geometry.

CPU based picking techniques do have advantages:

  • They can often provide precise intersection points on objects and they are better at handling picking of multiple objects, especially for objects that are occluded.
  • However, CPU based picking techniques are slower and can require more data on the CPU or they may need to be customized to the structure of the input data.

Note that while CPU based picking support could be added to luma.gl, luma does not currently include an CPU-based picking algorithms.