5.几何体Geometry

ShapeGeometry demo: geometry/shape.html ExtrudeGeometry demo: geometry/shape_3d.html

其他列子参考

BoxGeometry/BoxBufferGeometry 盒子几何体

构造函数

BoxGeometry(width : Float, height : Float, depth : Float, widthSegments : Integer, heightSegments : Integer, depthSegments : Integer)

BoxBufferGeometry(....)

两者参数相同:

  • width/height/depth 在x/y/z轴上的宽度,默认1
  • 后三个为可选的在侧面分段的面数,默认1
var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );

特性

  • parameters: Object 每个构造函数参数属性的对象,实例化后任何修改都不会改变几何图形

CircleGeometry/CircleBufferGeometry 圆形几何体(二维圆或部分)

构造函数

CircleGeometry(radius : Float, segments : Integer, thetaStart : Float, thetaLength : Float)

(可选)半径 默认1;(可选)分段默认8,最小3;(可选)开始角度默认0;(可选)周长 2*PI

特性

  • parameters: Object

ConeGeometry/ConeBufferGeometry圆锥几何体

构造函数

ConeGeometry(radius : Float, height : Float, radialSegments : Integer, heightSegments : Integer, openEnded : Boolean, thetaStart : Float, thetaLength : Float)

openEnded: 默认false,true则底部不显示

特性

  • parameters: Object

CylinderGeometry/CylinBufferGeometry圆柱几何体

构造函数

CylinderGeometry(radiusTop, radiusBottom, height, radiusSegments, heightSegments, openEnded, thetaStart, thetaLength)

openEnded: 默认false,true则底部不显示

特性

  • parameters: Object

DodecahedronGeometry/DodecahedronBufferGeometry十二面几何体

构造函数

DodecahedronGeometry(radius, detail)

detail: 默认0,设置后添加顶点不再是十二面体

EdgesGeometry查看几何体的边缘

构造函数

EdgesGeometry( geometry : Geometry, thresholdAngle : Integer )

ExtrudeGeometry/ExtrudeBufferGeometry(拉伸)塑型几何体,用形状路径来创建。二维图形变成三维图形的过程

构造函数

ExtrudeGeometry(shapes : Array, options : Object)

options包括以下参数

  • curveSegments 默认12
  • steps 默认1
  • depth 默认100
  • bevelEnabled 默认true 将斜面应用到形状上
  • bevelThickness 默认6 斜面深度
  • bevelSize 默认bevelThickness-2 与斜面延伸的形状轮廓的距离
  • bevelSegments 默认3
  • extrudePath 默认THREE.CurvePath 一种三维样条路径,该形状应沿着该路径进行挤压
  • UVGenerator Object

IcosahederonGeometry/IcosahedronBufferGeometry二十面几何体

构造函数

IcosahederonGeometry(radius, detail)

LatheGeometry/LatheBufferGeometry拉氏几何体(扫描面)

构造函数

LatheGeometry(points : Array, segments : Integer, phiStart : Float, phiLength : Float) 分段默认12

OctahedronGeometry/OctahedronBufferGeometry正八面体

构造函数

OctahedronGeometry(radius : Float, detail : Integer) 分段默认12

ParametricGeometry/ParametricBufferGeometry参数化几何体,可结合自定义函数创建类似波浪的图形

构造函数

ParametricGeometry(func : Function, slices : Integer, stacks : Integer)

  • func - 一个函数,它接收0和1之间的u和v值,并修改第三个Vector3参数
  • slice - 用于参数函数的切片计数
  • stacks - 用于参数函数的堆栈计数

PlaneGeometry/PlaneBufferGeometry平面几何体

构造函数

PlaneGeometry(width : Float, height : Float, widthSegments : Integer, heightSegments : Integer)

PolyhedronGeometry/PolyhedronBufferGeometry多面体

构造函数

OctahedronGeometry(radius : Float, detail : Integer)PolyhedronGeometry(vertices, faces, radius, detail)

RingGeometry/RingBufferGeometry圆环

构造函数

RingGeometry(innerRadius : Float, outerRadius : Float, thetaSegments : Integer, phiSegments : Integer, thetaStart : Float, thetaLength : Float) 参数均可选默认值依次为0/50/8/8/0/2*Math.PI

ShapeGeometry/ShapeBufferGeometry从一个或多个路径形状创建一个单面多边形几何模型(任意图形)

构造函数

ShapeGeometry(shapes : Array, curveSegments : Integer) 和SVG中的元素的功能类似,可调用的函数参考Extras(额外的部分)

SphereGeometry/SphereBufferGeometry

构造函数

SphereGeometry(radius : Float, widthSegments : Integer, heightSegments : Integer, phiStart : Float, phiLength : Float, thetaStart : Float, thetaLength : Float)

  • thetaStart — 指定垂直起始角度. 默认值为0.
  • thetaLength — 指定垂直扫描角度大小. 默认值为Math.PI. 几何模型是通过扫描和计算绕Y轴(水平扫描)和Z轴(垂直扫描)的顶点创建而成

TetrahedronGeometry/TetrahedronBufferGeometry四面体

构造函数

TetrahedronGeometry(radius : Float, detail : Integer)

TextGeometry/TextBufferGeometry文本几何体

构造函数

TextGeometry(text : String, parameters : Object)

parameters可选参数

    - font: THREE.Font, 
    - size: 100, 
    - height: 50, 
    - curveSegments: 12, 
    - bevelEnabled: false,  是否打开斜面 
    - bevelThickness: 10,斜面的深度 
    - bevelSize: 8,离文本轮廓多远是斜面 
    - bevelSegments: 3 斜面分段

TorusGeometry/TorusBufferGeometry环面几何体

构造函数

TorusGeometry(radius : Float, tube : Float, radialSegments : Integer, tubularSegments : Integer, arc : Float)

  • tube: 管道的宽度
  • radialSegments: 可理解为垂直方向的分段

TorusKnotGeometry/TorusKnotBufferGeometry环面打结几何体

构造函数

TorusKnotGeometry(radius : Float, tube : Float, tubularSegments : Integer, radialSegments : Integer, p : Integer, q : Integer)

  • p — 这个值决定了几何体绕旋转对称轴绕了多少圈. 默认值为2.
  • q — 这个值决定了几何体绕环面的圆绕了多少圈. 默认值为3.

TubeGeometry/TubeBufferGeometry沿着3D曲线挤压的管子

构造函数

TubeGeometry(path : Curve, tubularSegments : Integer, radius : Float, radialSegments : Integer, closed : Boolean)

WireframeGeometry以线框的方式查看几何对象

构造函数

WireframeGeometry( geometry : Geometry )

ConvexGeometry/ConvexBufferGeometry凸几何

可以用来生成一个给定的三维点阵列的凸包。这个任务的平均时间复杂度被认为是O(nlog(N)。

构造函数

  • ConvexGeometry( points : Array ) points-Vector3

DecalGeometry贴花几何

可以用来创建一个贴花网格,服务于不同的目的,如添加独特的细节模型,执行动态的视觉环境变化或覆盖接缝

构造函数

  • DecalGeometry( mesh : Mesh, position : Vector3, orientation : Euler, size : Vector3 )

参考地址


threejs
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里只属于前端工程师。