Three.js 动态贴图：使用 GIF 图片

要将 GIF 用作 Three.js 中的动态贴图，您需要使用 GIFLoader 模块。下面是使用 GIFLoader 模块的示例代码：

// 创建场景
var scene = new THREE.Scene();

// 创建相机
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 5;

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

// 加载 GIF 图片
var loader = new THREE.TextureLoader();
loader.load('path/to/your/gif', function(texture) {

  // 创建材质
  var material = new THREE.MeshBasicMaterial({
    map: texture,
    side: THREE.DoubleSide
  });

  // 创建几何体
  var geometry = new THREE.PlaneGeometry(1, 1);
  var mesh = new THREE.Mesh(geometry, material);

  // 将几何体添加到场景中
  scene.add(mesh);

  // 动画循环
  function animate() {
    requestAnimationFrame(animate);

    // 更新贴图
    texture.needsUpdate = true;

    renderer.render(scene, camera);
  }

  // 开始动画
  animate();

});

在上面的代码中，我们使用 TextureLoader 加载 GIF 图片。一旦加载完成，我们使用 MeshBasicMaterial 创建一个带有贴图的材质。然后，我们创建一个平面几何体并将其添加到场景中。在动画循环中，我们将贴图的 'needsUpdate' 属性设置为 true，以便在每一帧中更新贴图。最后，我们使用渲染器将场景渲染到屏幕上。

请确保将路径 'path/to/your/gif' 替换为您自己的 GIF 图片路径。