123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259 |
- <!DOCTYPE html>
- <html lang="it">
- <head>
- <meta charset="utf-8" />
- <base href="../../../" />
- <script src="page.js"></script>
- <link type="text/css" rel="stylesheet" href="page.css" />
- </head>
- <body>
- <h1>[name]</h1>
- <p class="desc">
- Un KeyframeTrack è una sequenza temporizzata di [link:https://en.wikipedia.org/wiki/Key_frame keyframe],
- composti da una lista di tempi e valori correlati, utilizzati per animare una proprietà specifica di un oggetto.
- </p>
- <p>
- Per una paronamica dei diversi elementi del sistema di animazione di three.js consultare l'articolo
- "Sistema di animazione" nella sezione "Prossimi Passi" del manuale.
- </p>
- <p>
- A differenza della gerarchia di animazione del [link:https://github.com/mrdoob/three.js/wiki/JSON-Model-format-3 modello JSON],
- `KeyframeTrack` non memorizza i suoi singoli keyframe come oggetti in un array "keys" (che contiene i tempi
- e i valori di ciascun frame in un unico posto).
- </p>
- <p>
- Invece ci sono sempre due array in un `KeyframeTrack`: l'array [page:.times times]
- memorizza i valori temporali per tutti i keyframe di questa traccia in ordine sequenziale e l'array
- [page:.values values] contiene i corrispondenti valori di modifica della proprietà animata.
- </p>
- <p>
- Un singolo valore, appartenente ad un determinato momento, non può essere solo un semplice numero, ma
- (per esempio) un vettore (se una posizione è animata) o un quaternione (se una rotazione è animata).
- Per questo motivo l'array values (che è anche un array flat) potrebbe essere tre o quattro volte
- più lungo dell'array times.
- </p>
- <p>
- In corrispondenza dei diversi tipi possibili di valori animati esistono diverse sottoclassi di `KeyframeTrack`,
- che ereditano la maggior parte delle proprietà e dei metodi:
- </p>
- <ul>
- <li>[page:BooleanKeyframeTrack]</li>
- <li>[page:ColorKeyframeTrack]</li>
- <li>[page:NumberKeyframeTrack]</li>
- <li>[page:QuaternionKeyframeTrack]</li>
- <li>[page:StringKeyframeTrack]</li>
- <li>[page:VectorKeyframeTrack]</li>
- </ul>
- <p>
- Alcuni esempi di come creare manualmente [page:AnimationClip AnimationClip] con diversi tipi di
- KeyframeTrack possono essere trovati nel file [link:https://threejs.org/examples/jsm/animation/AnimationClipCreator.js AnimationClipCreator].
- </p>
- <p>
- Poiché i valori espliciti sono solo specifici per i punti temporali discreti memorizzati nell'array times
- tutti i valori itermedi devono essere interpolati.
- </p>
- <p>
- Il nome della track è importante per il collegamento di questa track con una proprietà specifica
- del nodo animato (creato da [page:PropertyBinding]).
- </p>
- <h2>Costruttore</h2>
- <h3>[name]( [param:String name], [param:Array times], [param:Array values], [param:Constant interpolation] )</h3>
- <p>
- [page:String name] - l'identificativo per `KeyframeTrack`.<br />
- [page:Array times] - un array di times di keyframe, convertito internamente a
- [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array].<br />
- [page:Array values] - un array con i valori relativi all'array times, convertito internamente a
- [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array].<br />
- [page:Constant interpolation] - il tipo di interpolazione da usare. Vedi
- [page:Animation Animation Constants] per i possibili valori. L'impostazione predefinita è [page:Animation InterpolateLinear].
- </p>
- <h2>Proprietà</h2>
- <h3>[property:String name]</h3>
- <p>
- Il nome della track può riferirsi a morph targets o [page:SkinnedMesh bones] o possibilmente ad altri valori all'interno dell'oggetto animato.
- Vedi [page:PropertyBinding.parseTrackName] per le forme di stringhe che possono essere parsate per il property
- binding:
- </p>
- <p>
- Il nome può specificare il nodo utilizzando il suo nome o il suo uuid (anche se deve trovarsi
- nel sottoalbero del nodo del grafo della scena passato al mixer). Oppure, se il nome della track inizia con un punto,
- la track si applica al nodo root che è stato passato nel mixer.
- </p>
- <p>
- Solitamente dopo il nodo una proprietà viene specificata direttamente. Ma si può anche specificare
- una sottoproprietà, come .rotation[x], se si vuole guidare il componente X della rotazione tramite
- una traccia float.
- </p>
- <p>
- Si possono anche specificare ossa (bones) o multimateriali usando il nome di un oggetto, per esempio:
- .bones[R_hand].scale; il canale rosso del colore diffuso del quarto materiale in un array di materiali
- - come ulteriore esempio - è accessibile con .materials[3].diffuse[r].
- </p>
- <p>
- Il PropertyBinding risolverà anche i nomi dei morph target, per esempio: .morphTargetInfluences[run].
- </p>
- <p>
- Nota: Il nome della traccia non deve essere per forza univoco. Più tracce possono guidare la stessa proprietà.
- Il risultato deve essere basato su una miscela ponderata tra le tracce multiple in base ai pesi delle rispettive
- azioni.
- </p>
- <h3>[property:Float32Array times]</h3>
- <p>
- Un [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array],
- convertito dall'array times passato nel costruttore.
- </p>
- <h3>[property:Float32Array values]</h3>
- <p>
- Un [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array],
- convertito dall'array values passato nel costruttore.
- </p>
- <h3>[property:Constant DefaultInterpolation]</h3>
- <p>
- Il tipo predefinito di interpolazione: [page:Animation InterpolateLinear].
- </p>
- <h3>[property:Constant TimeBufferType ]</h3>
- <p>
- [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array],
- il tipo di buffer internamente utilizzato per i tempi.
- </p>
- <h3>[property:Constant ValueBufferType ]</h3>
- <p>
- [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array Float32Array],
- il tipo di buffer internamente utilizzato per i valori.
- </p>
- <h2>Metodi</h2>
- <h3>[method:KeyframeTrack clone]()</h3>
- <p>
- Restituisce una copia di questa traccia.
- </p>
- <h3>[method:Interpolant createInterpolant]()</h3>
- <p>
- Crea una [page:LinearInterpolant LinearInterpolant], [page:CubicInterpolant CubicInterpolant]
- o [page:DiscreteInterpolant DiscreteInterpolant], a seconda del valore del parametro di interpolazione
- passato nel costruttore.
- </p>
- <h3>[method:Interpolant getInterpolation]()</h3>
- <p>
- Restituisce il tipo di interpolazione.
- </p>
- <h3>[method:Number getValueSize]()</h3>
- <p>
- Restituisce la dimensione di ongi value (ovvero la lunghezza dell'array [page:.values values] diviso
- la lunghezza dell'array [page:.times times]).
- </p>
- <h3>[method:DiscreteInterpolant InterpolantFactoryMethodDiscrete]( [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array result] )</h3>
- <p>
- Crea un nuovo [page:DiscreteInterpolant DiscreteInterpolant] dai [page:KeyframeTrack.times tempi] e
- dai [page:KeyframeTrack.times valori]. È possibile passare un Float32Array che riceverà i risultati.
- Altrimenti, verrà creato automaticamente un nuovo array di dimensioni appropriate.
- </p>
- <h3>[method:LinearInterpolant InterpolantFactoryMethodLinear]( [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array result] )</h3>
- <p>
- Crea un nuovo [page:LinearInterpolant LinearInterpolant] dai [page:KeyframeTrack.times tempi] e
- dai [page:KeyframeTrack.times valori].È possibile passare un Float32Array che riceverà i risultati.
- Altrimenti, verrà creato automaticamente un nuovo array di dimensioni appropriate.
- </p>
- <h3>[method:CubicInterpolant InterpolantFactoryMethodSmooth]( [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array result] )</h3>
- <p>
- Crea un nuovo [page:CubicInterpolant CubicInterpolant] dai [page:KeyframeTrack.times tempi] e
- dai [page:KeyframeTrack.times valori].È possibile passare un Float32Array che riceverà i risultati.
- Altrimenti, verrà creato automaticamente un nuovo array di dimensioni appropriate.
- </p>
- <h3>[method:this optimize]()</h3>
- <p>
- Rimuove le chiavi sequenziali equivalenti, che sono comuni nelle sequenze morph target.
- </p>
- <h3>[method:this scale]()</h3>
- <p>
- Scala tutti i tempi del keyframe di un fattore.<br /><br />
- Nota: Questo metodo è utile, per esempio, per le conversioni ad un determinato rate di frame per secondo (come
- avviene internamente da
- [page:AnimationClip.CreateFromMorphTargetSequence animationClip.CreateFromMorphTargetSequence]).
- </p>
- <h3>[method:this setInterpolation]( [param:Constant interpolationType] )</h3>
- <p>
- Imposta il tipo di interpolazione. Vedi [page:Animation Animation Constants] per le opzioni.
- </p>
- <h3>[method:this shift]( [param:Number timeOffsetInSeconds] )</h3>
- <p>
- Sposta tutti i keyframe avanti o indietro nel tempo.
- </p>
- <h3>[method:this trim]( [param:Number startTimeInSeconds], [param:Number endTimeInSeconds] )</h3>
- <p>
- Rimuove tutti i keyframe prima di `startTime` e dopo `endTime`,
- senza modificare alcun valore nell'intervallo [`startTime`, `endTime`].
- </p>
- <h3>[method:Boolean validate]()</h3>
- <p>
- Esegue una convalida minima delle tracce. Restituisce true se è valido.
- </p>
- <p>
- Questo metodo registra gli errori nella console, se una traccia è vuota, se la dimensione del valore non è valida,
- se un elemento nell'array [page:.times times] o nell'array [page:.values values] non è un numero valido o se
- gli elementi nell'array times non sono ordinati.
- </p>
- <h2>Metodi statici</h2>
- <h3>[method:JSON toJSON]( [param:KeyframeTrack track] )</h3>
- <p>
- Converte la traccia in JSON.
- </p>
- <h2>Source</h2>
- <p>
- [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
- </p>
- </body>
- </html>
|