小白学webgl合集-Three.js加载器

THREE.TextureLoader:

• 用途: 加载单个图像文件并将其作为纹理应用到材质上。
• 示例:

• const loader = new THREE.DataTextureLoader();
  loader.load('path/to/data.bin', function (texture) {const material = new THREE.MeshBasicMaterial({ map: texture });const geometry = new THREE.PlaneGeometry(500, 500);const plane = new THREE.Mesh(geometry, material);scene.add(plane);
  });
  

THREE.CubeTextureLoader:

• 用途: 加载六个图像文件并将其作为立方体纹理应用到天空盒子或反射/折射环境贴图上。
• 示例:

const loader = new THREE.CubeTextureLoader();
const texture = loader.load(['path/to/px.jpg','path/to/nx.jpg','path/to/py.jpg','path/to/ny.jpg','path/to/pz.jpg','path/to/nz.jpg'
]);
scene.background = texture;

THREE.DataTextureLoader:

• 用途: 加载原始二进制数据并将其作为纹理应用。这通常用于特殊用途，如加载 HDR 图像或高度图。
• 示例:

  const loader = new THREE.DataTextureLoader();
  loader.load('path/to/data.bin', function (texture) {const material = new THREE.MeshBasicMaterial({ map: texture });const geometry = new THREE.PlaneGeometry(500, 500);const plane = new THREE.Mesh(geometry, material);scene.add(plane);
  });