在three.js中用灯光跟随鼠标位置

在Three.js中，要实现灯光跟随鼠标位置的功能，可以通过以下步骤来完成：

创建一个Raycaster对象，用于检测鼠标位置与场景中物体的交互。
监听鼠标的移动事件，更新Raycaster对象的鼠标位置。
根据Raycaster对象的计算结果，调整灯光的位置。

下面是一个简单的示例代码，展示了如何实现灯光跟随鼠标位置的功能：

// 引入Three.js库
import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';

// 场景、相机和渲染器的创建
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// 创建一个聚光灯
const spotlight = new THREE.SpotLight(0xffffff, 1, 100);
scene.add(spotlight);

// 设置聚光灯的位置
spotlight.position.set(0, 10, 20);

// 添加一个平面作为地面
const planeGeometry = new THREE.PlaneGeometry(50, 50);
const planeMaterial = new THREE.MeshStandardMaterial({ color: 0x999999 });
const plane = new THREE.Mesh(planeGeometry, planeMaterial);
plane.rotation.x = -Math.PI / 2;
scene.add(plane);

// 设置相机位置
camera.position.z = 30;

// 添加轨道控制，以便可以旋转和缩放场景
const controls = new OrbitControls(camera, renderer.domElement);

// 创建一个Raycaster对象
const raycaster = new THREE.Raycaster();

// 监听鼠标的移动事件
window.addEventListener('mousemove', onMouseMove, false);

function onMouseMove(event) {
    // 将鼠标位置归一化
    const mouseX = (event.clientX / window.innerWidth) * 2 - 1;
    const mouseY = -(event.clientY / window.innerHeight) * 2 + 1;

    // 更新Raycaster对象的鼠标位置
    raycaster.setFromCamera(new THREE.Vector2(mouseX, mouseY), camera);

    // 计算与平面的交点
    const intersects = raycaster.intersectObject(plane);

    if (intersects.length > 0) {
        // 如果有交点，将聚光灯的位置设置为交点的位置
        spotlight.position.copy(intersects[0].point);
    }
}

// 渲染循环
function animate() {
    requestAnimationFrame(animate);
    renderer.render(scene, camera);
}

animate();

在这个示例中，我们创建了一个聚光灯，并将其初始位置设置在场景的上方。然后，我们监听鼠标的移动事件，使用Raycaster对象来计算鼠标位置与平面的交点，并将聚光灯的位置设置为该交点的位置。这样，当鼠标在场景中移动时，聚光灯就会跟随鼠标的位置。

请注意，这个示例假设场景中有一个平面作为地面。如果你的场景中没有平面，你需要根据实际情况调整raycaster.intersectObject()方法中的参数，以便正确计算交点。