0
我有一個360度的場景,我放置了一些imgs(sprits)。我想讓這個imgs可點擊,這樣我就可以收到一個函數,如果我點擊它。三個js可點擊圖片中的圖片
我的代碼:
var map = new THREE.TextureLoader().load("arrow-poi.png");
var material = new THREE.SpriteMaterial({ map: map, color: 0xffffff, fog: true });
var sprite = new THREE.Sprite(material);
var geometry = new THREE.PlaneGeometry(6,6);
sprite.material.side = THREE.DoubleSide,
sprite.position.x= 40,
sprite.position.y= -6,
sprite.position.z= 10,
sprite.scale.set(6,6,1),
sprite.name="arrow",
sprite.directto=r,
document.addEventListener('mousedown', onDocumentMouseDown, false);
raycaster = new THREE.Raycaster();
mouse = new THREE.Vector3(0, 1, 0);
projector = new THREE.Projector();
clickableObjects = [];
clickableObjects.push(sprite, sprite1);
function onDocumentMouseDown(event){
event.preventDefault();
var vector = new THREE.Vector3((event.clientX/window.innerWidth) * 2 - 1, - (event.clientY/window.innerHeight) * 2 + 1, 0.5);
projector.unprojectVector(vector, camera);
var raycaster = new THREE.Raycaster(camera.position, vector.sub( camera.position).normalize());
var intersects = raycaster.intersectObjects(clickableObjects);
if (intersects.length > 0) {
intersects[0].object.onClick();
}
}
sprite1.onClick = function(){console.log('Clicked');}