three.js CubicBezierCurve

2023-02-16 17:33 更新

創(chuàng)建一條平滑的二維 三次貝塞爾曲線, 由起點(diǎn)、終點(diǎn)和兩個(gè)控制點(diǎn)所定義。

代碼示例

const curve = new THREE.CubicBezierCurve(
	new THREE.Vector2( -10, 0 ),
	new THREE.Vector2( -5, 15 ),
	new THREE.Vector2( 20, 15 ),
	new THREE.Vector2( 10, 0 )
);

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 );

構(gòu)造函數(shù)

CubicBezierCurve ( v0 : Vector2, v1 : Vector2, v2 : Vector2, v3 : Vector2 )

v0 – 起點(diǎn)
v1 – 第一個(gè)控制點(diǎn)
v2 – 第二個(gè)控制點(diǎn)
v3 – 終點(diǎn)

屬性

共有屬性請參見其基類Curve。

.v0 : Vector2

起點(diǎn)

.v1 : Vector2

第一個(gè)控制點(diǎn)

.v2 : Vector2

第二個(gè)控制點(diǎn)

.v3 : Vector2

終點(diǎn)

方法

共有方法請參見其基類Curve。

源代碼

src/extras/curves/CubicBezierCurve.js


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號