[page:Curve] → [page:CurvePath] →

[name]

Una rappresentazione del percorso 2D. La classe mette a dispozione metodi per la creazione di tracciati e contorni di forme 2D simili all'API Canvas 2D.

Codice di Esempio

const path = new THREE.Path(); path.lineTo( 0, 0.8 ); path.quadraticCurveTo( 0, 1, 0.2, 1 ); path.lineTo( 1, 1 ); const points = path.getPoints(); const geometry = new THREE.BufferGeometry().setFromPoints( points ); const material = new THREE.LineBasicMaterial( { color: 0xffffff } ); const line = new THREE.Line( geometry, material ); scene.add( line );

Costruttore

[name]( [param:Array points] )

points -- (opzionale) array di [page:Vector2 Vector2].

Crea un Path dai punti. Il primo punto definisce l'offset, quindi i punti successivi sono aggiunti all'array [page:CurvePath.curves curves] come [page:LineCurve LineCurves].

Se non ci sono punti specificati, viene creato un path vuoto e il [page:.currentPoint] viene impostato nell'origine.

Proprietà

Vedi la classe base [page:CurvePath] per le proprietà comuni.

[property:Vector2 currentPoint]

L'offset corrente del path. Qualsiasi nuova [page:Curve] aggiunta inizierà da qui.

Metodi

Vedi la classe base [page:CurvePath] per i metodi comuni.

[method:this absarc]( [param:Float x], [param:Float y], [param:Float radius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise] )

x, y -- Il centro assoluto dell'arco.
radius -- Il raggio dell'arco.
startAngle -- L'angolo iniziale in radianti.
endAngle -- L'angolo finale in radianti.
clockwise -- Scorre l'arco in senso orario. Il valore predefinito è `false`.

Aggiunge al path un'[page:EllipseCurve EllipseCurve] posizionata in modo assoluto.

[method:this absellipse]( [param:Float x], [param:Float y], [param:Float xRadius], [param:Float yRadius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise], [param:Float rotation] )

x, y -- Il centro assoluto dell'ellisse.
xRadius -- Il raggio dell'ellisse nell'asse x.
yRadius -- Il raggio dell'ellisse nell'asse y.
startAngle -- L'angolo iniziale in radianti.
endAngle -- L'angolo finale in radianti.
clockwise -- Scorre l'ellisse in senso orario. Il valore predefinito è `false`.
rotation -- L'angolo di rotazione dell'ellisse in radianti, in senso antiorario dall'asse X. Opzionale, il valore predefinito è 0.

Aggiunge al path un'[page:EllipseCurve EllipseCurve] posizionata in modo assoluto.

[method:this arc]( [param:Float x], [param:Float y], [param:Float radius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise] )

x, y -- Il centro dell'arco offsettato dall'ultima chiamata.
radius -- Il raggio dell'arco.
startAngle -- L'angolo iniziale in radianti.
endAngle -- L'angolo finale in radianti.
clockwise -- Scorre l'arco in senso orario. Il valore predefinito è `false`.

Aggiunge al path un'[page:EllipseCurve EllipseCurve] posizionata in modo relativo al [page:.currentPoint].

[method:this bezierCurveTo]( [param:Float cp1X], [param:Float cp1Y], [param:Float cp2X], [param:Float cp2Y], [param:Float x], [param:Float y] )

Crea una curva bezier da [page:.currentPoint] con (cp1X, cp1Y) e (cp2X, cp2Y) come punti di controllo e aggiorna [page:.currentPoint] a x e y.

[method:this ellipse]( [param:Float x], [param:Float y], [param:Float xRadius], [param:Float yRadius], [param:Float startAngle], [param:Float endAngle], [param:Boolean clockwise], [param:Float rotation] )

x, y -- Il centro dell'arco offsettato dall'ultima chiamata.
xRadius -- Il raggio dell'ellisse nell'asse x.
yRadius -- Il raggio dell'ellisse nell'asse y.
startAngle -- L'angolo iniziale in radianti.
endAngle -- L'angolo finale in radianti.
clockwise -- Scorre l'arco in senso orario. Il valore predefinito è `false`.

rotation -- L'angolo di rotazione dell'ellisse in radianti, in senso antiorario dall'asse X. Opzionale, il valore predefinito è 0.

Aggiunge al path un'[page:EllipseCurve EllipseCurve] posizionata in modo relativo al [page:.currentPoint].

[method:this lineTo]( [param:Float x], [param:Float y] )

Collega una [page:LineCurve] da il [page:.currentPoint] a x, y sul percorso.

[method:this moveTo]( [param:Float x], [param:Float y] )

Muove il [page:.currentPoint] a x, y.

[method:this quadraticCurveTo]( [param:Float cpX], [param:Float cpY], [param:Float x], [param:Float y] )

Crea una curva quadratica da [page:.currentPoint] con cpX e cpY come punto di controllo e aggiorna [page:.currentPoint] a x e y.

[method:this setFromPoints]( [param:Array vector2s] )

points -- array di [page:Vector2 Vector2].

I punti vengono aggiunti all'array [page:CurvePath.curves curves] come [page:LineCurve LineCurves].

[method:this splineThru] ( [param:Array points] )

points - array di [page:Vector2 Vector2].

Collega un nuovo [page:SplineCurve] al percorso.

Source

[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]