ThreeJS 对模型材质进行定时切换，使得有闪烁效果

秋洛_

已于 2024-07-16 11:21:29 修改

阅读量214

点赞数 3

文章标签： webgl js vue typescript javascript

于 2024-07-16 11:20:12 首次发布

本文链接：https://blog.csdn.net/weixin_43807413/article/details/140461373

版权

ThreeJS 对模型材质进行定时切换，使得有闪烁效果

const startBlinking = (part, mac_id) => {
  const duration = 100;
  const originalColors = new Map<string, THREE.Color>();
  const mesh = part as THREE.Mesh;
  const material = mesh.material as THREE.MeshStandardMaterial;
  originalColors.set(mac_id, material.color.clone());
  const originalColor = part.material.color.clone();
  // 这里根据定时器去定时切换材质的颜色
  const blinkInterval = setInterval(() => {
    if (part.material.color.equals(originalColor)) {
      part.material.color.set(0xffffff);
      part.material.color.opacity = 1;
    } else {
      part.material.color.copy(originalColor);
      part.material.color.opacity = 0;
    }
  }, duration);
  colorChangeTimers.set(mac_id, { timer: blinkInterval, originalColors });
};