codecamp

three.js CatmullRomCurve3

使用Catmull-Rom算法, 从一系列的点创建一条平滑的三维样条曲线。

代码示例

//Create a closed wavey loop
const curve = new THREE.CatmullRomCurve3( [
	new THREE.Vector3( -10, 0, 10 ),
	new THREE.Vector3( -5, 5, 5 ),
	new THREE.Vector3( 0, 0, 0 ),
	new THREE.Vector3( 5, -5, 5 ),
	new THREE.Vector3( 10, 0, 10 )
] );

const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );

const material = new THREE.LineBasicMaterial( { color: 0xff0000 } );

// Create the final object to add to the scene
const curveObject = new THREE.Line( geometry, material );

例子

WebGL / geometry / extrude / splines

构造函数

CatmullRomCurve3( points : Array, closed : Boolean, curveType : String, tension : Float )

points – Vector3点数组
closed – 该曲线是否闭合,默认值为false。
curveType – 曲线的类型,默认值为centripetal
tension – 曲线的张力,默认为0.5

属性

共有属性请参见其基类Curve。

.points : Array

定义了这一曲线的Vector3点数组,数组中至少需要两个点。

.closed : Boolean

当该值为true时,曲线将会闭合(环回自身)。

.curveType : String

可能的值为centripetal、chordal和catmullrom。

.tension : Float

当.curveType为catmullrom时,定义catmullrom的张力。

方法

共有方法请参见其基类Curve。

源代码

src/extras/curves/CatmullRomCurve3.js


three.js ArcCurve
three.js CubicBezierCurve
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

参考

核心 / BufferAttributes

渲染器 / WebXR

开发者参考

WebGL渲染器

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }