Adding a 2d mesh as a button using raycasting to download a document in threejs scene

Hi! I’m creating a scene wherein I need to download a document file when a 2d mesh is clicked using raycasting.
I have created 2 meshes that play and pause a video using raycasting but I’m unsure about the downlaod part.

Any Suggestions??

Hope this code points you in the right direction. Code adapted from three.js/misc_exporter_gltf.html at 309b00afb6dcbc5e6c58e72f10eaa8d2e8888c83 · mrdoob/three.js · GitHub

static link: any;

constructor() {
if (! { = document.createElement(‘a’); = ‘none’;
document.body.appendChild(; // Firefox workaround, see #6594

save(blob: any, filename: string) { = URL.createObjectURL(blob); = filename;;

// URL.revokeObjectURL( url ); breaks Firefox...


saveString(text: string, filename: string) { Blob([text], { type: 'text/plain' }), filename);


saveArrayBuffer(buffer: any, filename: string) { Blob([buffer], { type: 'application/octet-stream' }), filename);