three.js物理网格材质(玻璃)

import * as THREE from 'three';
 
// 创建一个全局的三维场景，用来放置所有的物体
const scene = new THREE.Scene();
 
// 创建一个相机对象
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
 
// 创建一个渲染器并将它的DOM元素加到HTML文档中
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
 
// 创建一个立方体的几何对象
const geometry = new THREE.BoxGeometry(1, 1, 1);
 
// 定义一个玻璃材质
const glassMaterial = new THREE.MeshPhysicalMaterial({
  color: 0xffffff, // 玻璃颜色
  clearcoat: 1.0, // 清洁层强度
  clearcoatRoughness: 0.0, // 清洁层粗糙度
  reflectivity: 0.5, // 镜面反射强度
  ior: 1.5, // 表面光学参数，玻璃的值通常是1.5
  transmission: 1.0, // 透明度
  roughness: 0.0, // 粗糙度
  metalness: 0.0, // 金属度
  specularIntensity: 0.5, // 镜光强度
  specularColor: new THREE.Color(1.0, 1.0, 1.0), // 镜光颜色
});
 
// 使用定义好的玻璃材质创建一个物体
const cube = new THREE.Mesh(geometry, glassMaterial);
 
// 将立方体添加到场景中
scene.add(cube);
 
// 设置相机位置并指向场景
camera.position.z = 5;
 
// 渲染场景
function animate() {
  requestAnimationFrame(animate);
  renderer.render(scene, camera);
}
 
animate();

这段代码创建了一个简单的三维场景，包含了一个使用玻璃材质定义的立方体。通过调整玻璃材质的属性，可以模拟出不同的玻璃表面效果。