Tengo una galaxia hecha de 3 planetas y una nave espacial y quiero que se pueda hacer clic en todos ellos para cargar otra página. Logré hacerlo con los 3 planetas agregando planet.userData = {URL: "my.html"}; pero no con la nave espacial, que es un modelo cargado con GLTF.
Así es como cargué la nave espacial:
const loader = new GLTFLoader(); loader.load('models/spaceship.glb', function(gltf) { const spaceship = gltf.scene; spaceship.scale.set(0.08, 0.08, 0.08); spaceship.userData = {URL: "my.html"}; //Adding the URL here objects.push(spaceship); //This is for raycasting scene.add(spaceship); }, undefined, function(error){ console.error(error); });Y esta es la función para el evento Mouse Down:
function onDocumentMouseDown(){ mouse.x = (event.clientX/window.innerWidth)*2-1; mouse.y = -(event.clientY/window.innerHeight)*2+1; const raycaster = new THREE.Raycaster(); raycaster.setFromCamera(mouse, camera); const intersects = raycaster.intersectObjects(objects, true); if ( intersects.length > 0 ) { window.open(intersects[0].object.userData.URL); // <-- Doesn't work } }Al hacer clic en la nave espacial, el valor de la URL es "indefinido". Estoy seguro de que hay otra manera de hacerlo, pero no puedo encontrar ninguna solución. ¡Muchas gracias de antemano a cualquiera que ayude!