Three.js学习之几何形状
146 浏览量
2020-10-21
20:08:35
上传
评论
收藏 57KB PDF 举报
Three.js学习之几何形状学习之几何形状
本文利用实例代码详细介绍了一些Three.js中的几何形状的实现过程，包括立方体、平面与球体，有需要的朋友
们可以学习下。
1.立方体立方体
虽然这一形状的名字叫立方体（CubeGeometry），但它其实是长方体，也就是长宽高可以设置为不同的值。其构造函数
是：
THREE.CubeGeometry(width,height,depth,widthSegments,heightSegments, depthSegments)
width：：x方向上的长度
height：：y方向上的长度
depth：：z方向上的长度
widthSegments：：x方向上的分段数（可选，缺省值1）
heightSegments：：y方向上的分段数（同上）
depthSegments：：z方向上的分段数（同上）
未分段：未分段：
var material = new THREE.MeshBasicMaterial({
color: 0xffff00,
wireframe: true
});
drawCube(scene, material);
function drawCube(scene, material) {
var cube = new THREE.Mesh(new THREE.CubeGeometry(1, 2, 3), material);
scene.add(cube);
}
物体的默认位置是原点，对于立方体而言，是其几何中心在原点的位置。
分段：分段：
var cube = new THREE.Mesh(new THREE.CubeGeometry(1, 2, 3, 2, 2, 3), material);
为什么会有这么多邪线呢？版本问题。R73版本：
注意这个分段是对六个面进行分段分段是对六个面进行分段，而不是对立方体的体素分段，因此在立方体的中间是不分段的，只有六个侧面被分
段。
2.平面平面
这里的平面（PlaneGeometry）其实是一个长方形，而不是数学意义上无限大小的平面。其构造函数为：
THREE.PlaneGeometry(width, height, widthSegments, heightSegments)
width：：x方向上的长度
height：：y方向上的长度
widthSegments：：x方向上的分段数（可选，缺省值1）
heightSegments：：y方向上的分段数（同上）
new THREE.PlaneGeometry(2, 4);创建的平面在x轴和y轴所在平面内，效果如下：
评论0
最新资源