Lernen threejs/webGL - Farbe und Transparenz

Question

Ich tue mein Bestes, um threejs/webgl zu lernen, indem ich in Code eintauche, und finde keine Lösungen.

ich mit dem ocean2 Shader (https://github.com/mrdoob/three.js/blob/master/examples/webgl_shaders_ocean2.html)

First-, was sind die Farben hier gerade arbeite verwendet? Es scheint nicht zu sein HSL

OCEAN_COLOR: new THREE.Vector3(0.004, 0.016, 0.047), 
SKY_COLOR: new THREE.Vector3(3.2, 9.6, 12.8), 

Zweitens - ist es möglich, das Alpha davon zu ändern?

Ich versuche, ein Bild unter dem Ozean zu haben, oder die Textur ersetzen alle zusammen wie in diesem Beispiel getan wird (http://maevabarriere.com/installation-comestible)

Ich weiß, diese vage Fragen sind, aber ich habe seit einigen Tagen erforscht und scheint keine Antworten zu finden, also würde sogar ein Punkt in die richtige Richtung sehr geschätzt werden. Ich freue mich darauf, mehr darüber zu erfahren!

Answer 1

Wenn Sie three.js lernen, indem Sie das Beispiel des Ozeanshaders studieren, springen Sie in das tiefe Ende. Dieses Beispiel ist am besten für Benutzer geeignet, die bereits mit Shadern und three.js vertraut sind.

SKY_COLOR ist eine Repräsentation einer RGB-Farbe mit hohem Dynamikumfang, die nur für dieses Beispiel spezifisch ist.

https://github.com/mrdoob/three.js/blob/master/examples/js/shaders/OceanShaders.js

Wenn Sie das Meer transparent sein wollen, würden Sie den Shader hacken müssen.

Farben in three.js werden normalerweise durch THREE.Color dargestellt. THREE.Color hat keine Alpha-Komponente.

Die Opazität in three.js wird normalerweise von material.opacity angegeben.

three.js r.75