你可以通过修改贴图的 repeat 和 offset 属性，并在动画循环中动态改变 offset ，实现贴图上的图案循环播放（比如流动效果）。你已经在 textureFlow.offset.x -= 0.04 这样做了。
注意：Three.js 默认会将贴图在 Y 轴翻转。如果贴图上下颠倒，可以设置：texture.flipY = false;
如果你想让贴图在模型表面循环滚动（比如箭头不断流动），可以这样设置：
# 1. 设置 repeat
让贴图在 UV 上重复显示多次：
// filepath: d:\lxl\xlong\threejs\prj\vite-project-tf\src\main.js | |
textureFlow.wrapS = THREE.RepeatWrapping | |
textureFlow.wrapT = THREE.RepeatWrapping | |
textureFlow.repeat.set(4, 1) // X 方向重复 4 次，Y 方向 1 次 |
# 2. 在动画循环中动态修改 offset
你已经有了：
textureFlow.offset.x -= 0.04 |
这样贴图会不断向左流动。你可以根据需要调整速度和方向。
# 3. 让 offset 循环
防止 offset 无限增大或减小，可以这样：
// filepath: d:\lxl\xlong\threejs\prj\vite-project-tf\src\main.js | |
function animate() { | |
stats.update() | |
controls.update() | |
if (animationMixer) { | |
animationMixer.update(clock.getDelta()) | |
} | |
textureFlow.offset.x = (textureFlow.offset.x - 0.04) % 1 // 保证 offset 在 0~1 之间 | |
renderer.render(scene, camera) | |
renderer.setPixelRatio(window.devicePixelRatio) | |
requestAnimationFrame(animate) | |
} |
这样就能让贴图上的图案循环流动播放。如果你要让贴图在 Y 方向流动，只需改为 textureFlow.offset.y 。
如需更复杂的流动（比如波浪、变速），可以用 Shader 或自定义材质实现。
