我用的的示例类发方式来初始化场景。
类里面定义点击方法。
initMouse(fun) {window.addEventListener("click", (event) => {this.clickObject(event, fun);});}// 鼠标事件clickObject(event, fun) {// 计算点击位置的归一化设备坐标const mouse = new THREE.Vector2();mouse.x = (event.clientX / window.innerWidth) * 2 - 1;mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;// 创建射线投射器const raycaster = new THREE.Raycaster();raycaster.setFromCamera(mouse, this.camera);// 获取与射线相交的物体数组const intersects = raycaster.intersectObjects(this.scene.children, true);if (intersects.length > 0) {// intersects[0].object 是与射线相交的第一个物体const clickedObject = intersects[0].object;// 这里可以进一步处理点击的物体fun(intersects[0].object);// clickedObject.material.color.set(0xff0000); // 设置点击物体的颜色为红色}}
使用时调用initMouse传入回调函数。
ffThree.initMouse(callBack);function callBack(obje) {console.log("obje为选中的物体 下面写对选中物体做的事情");obje.material.color.set(0xff0000);
}