修改detail值为5:
EdgesGeometry 通常基于其它几何体,用来生成边缘几何体图形。
其构造函数:
THREE.EdgesGeometry(geometry, thresholdAngle)
参数说明:
- geometry: 原始几何体,可以是任何支持边缘显示的几何体;
- thresholdAngle: 一个可选的角度阈值,用于控制哪些边被显示。在视角小于 thresholdAngle 的情况下会显示边。默认值为 1.5。
const originalGeometry = new THREE.BoxGeometry(3, 3, 3);
const edgesGeometry = new THREE.EdgesGeometry(originalGeometry);
const material = new THREE.LineBasicMaterial({ color: 0xFFFF00 });
const myGeometry = new THREE.LineSegments(edgesGeometry, material);
scene.add(myGeometry);
这里创建了一个立方体,边缘几何体基于立方体来创建,运行效果:
5. 挤出几何体(ExtrudeGeometry )2.5.1 挤出几何体说明挤出几何体是通过沿着轮廓路径将一个平面形状挤压而成的三维形状。这个类的构造函数接受两个主要参数:轮廓路径和挤出选项。
构造函数:
THREE.ExtrudeGeometry(shapes, options)
参数说明:
- shapes: 一个或多个描述轮廓形状的 Shape 对象或路径。可以是单个 Shape 对象或由多个 Shape 组成的数组;
- options: 挤出选项,是一个包含挤出相关参数的对象。常见的选项包括 amount(挤出的距离)和 bevelEnabled(是否启用斜角),还可以设置其他参数。
const width = 3;
const height = 1;
const depth = 1;
const extrudeAmount = 3;
// 创建一个矩形轮廓
const rectShape = new THREE.Shape();
rectShape.moveTo(0, 0);
rectShape.lineTo(0, height);
rectShape.lineTo(width, height);
rectShape.lineTo(width, 0);
rectShape.lineTo(0, 0);
// 设置挤出选项
const extrudeOptions = {
amount: extrudeAmount,
bevelEnabled: true,
bevelSegments: 2,
steps: 1,
bevelSize: 0.5,
bevelThickness: 0.5,
};
// 创建 ExtrudeGeometry
const geometry = new THREE.ExtrudeGeometry(rectShape, extrudeOptions);
// 创建材质和网格
const material = new THREE.MeshBasicMaterial({ color: 0x00ffFF, wireframe: true });
const myGeometry = new THREE.Mesh(geometry, material);
scene.add(myGeometry);
运行效果:
6. 二十面体(IcosahedronGeometry)2.6.1 构造函数THREE.IcosahedronGeometry(radius, detail)
参数说明:
- radius: 二十面体的外接球的半径;
- detail: 可选参数,控制几何体的细分层级。可以是整数值,表示将每个三角面细分为更小的三角形的次数。默认值为 0。
const radius = 1;
const detail = 1;
const icosahedronGeometry = new THREE.IcosahedronGeometry(radius, detail);
const material = new THREE.MeshPhongMaterial({ color: 0x00ff00, wireframe: true });
const myGeometry = new THREE.Mesh(icosahedronGeometry, material);
scene.add(myGeometry);
运行效果: