three.js中创建点光源

在Three.js中，点光源（Point Light）是常用的一种光照类型，它模拟的是一个发光的小点，通常用于创建局部或集中光线效果。要创建一个点光源，你可以按照以下步骤进行：

1. 引入Three.js库和相关模块：

import * as THREE from 'three';

2. 创建一个新的点光源实例：

const pointLight = new THREE.PointLight(0xffffff, // 发光颜色
                                          1.0,       // 光源强度
                                          0.5);      // 光照衰减系数，范围从0到1，0表示无衰减

这里，`0xffffff`代表白色光源，`1.0`是强度（默认为1），`0.5`是光照衰减系数，值越小灯光越集中。

3. 定义光源的位置：

pointLight.position.set(0, 10, 10); // 设置光源的初始位置

这一步非常重要，因为光源位置决定了光照的方向和范围。

4. 将光源添加到场景中：

scene.add(pointLight);

`scene`是Three.js中的主场景对象，将光源添加进去才能让它参与渲染。

5. 渲染器设置：

renderer.render(scene, camera); // 渲染器（Renderer）渲染场景

完整的示例代码片段如下：

// 初始化
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

// 创建光源
const pointLight = new THREE.PointLight(0xffffff, 1.0, 0.5);
pointLight.position.set(0, 10, 10);

// 添加光源到场景
scene.add(pointLight);

// 创建渲染器和渲染
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

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

animate();